某些行在页面及其源代码中未显示

时间:2015-12-29 16:48:40

标签: php jquery html css

我对css有一个问题,但我不能解决它。我有20个结果应该显示在我的网站上,但它只显示其中的14个..如果我选择检查器,我可以在源代码中看到它们的其他结果。 我可以向上或向下移动菜单的位置,我可以看到其他元素是隐藏的,但只有向下或向上移动我可以看到它们,而我却无法增加显示的空间大小行。

这是我的问题的屏幕截图,应该有20个结果:enter image description here

这是我的html-php代码:

    <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"><head>


        <title>Offers | <?php echo SITE_NAME; ?> example</title>





        <link type="text/css" rel="stylesheet" href="css/jQueryCustom.css">
        <link type="text/css" rel="stylesheet" href="css/commons.css">
        <link type="text/css" rel="stylesheet" href="css/helpers.css">
        <style type="text/css">
        .biggerfont {   font-size: 14px;
}
        </style>


        </head><body  class="tgz" >

            <?php include('includes/header.php'); ?>
         <?php include('includes/sub_menu.php'); ?>
        <div id="app_content">
          <div class="container">

            <style>
#ajaxLoadingModalBox{
    display:none;
}
#ajaxLoadingModalBox_container{
    background-color: inherit;
    position: fixed; 
    z-index: 2000; 
    background-color: inherit; 
    padding: 0px;
    width: 72px; 
    height: 72px; 
    left: 46%; 
    top: 46%;
}
.rf-pp-shade {
    background-color: #D0D0D0;
    height: 100%;
    left: 0;
    opacity: 0.5;
    position: fixed;
    top: 0;
    width: 100%;
}
#project_selector [isDisabled = 'true']{
    color : grey;
}
            </style>
            <div id="error_messages"></div>
            <div class="page-content">   <div class="ui-tabs ui-widget ui-widget-content ui-corner-all" id="script-tabs"> 
              <div id="projects_container" class="clearfix">
                <div class="clearfix" style="display: table;">
                  <div id="menu_left" style="display: table-cell; vertical-align: top;">
                    <div id="project_creator"> <a id="create-new-item" href="create_offer.html">Create new Offer</a></div>
                    <div id="project_selector">
                      <form action="offers.html" method="get">
                        <input placeholder="Search" id="projects_list_search" type="text" name="search" value="<?=$search;?>"/>
                      </form>
                      <div id="projects_list">
                        <div style="height: 354px;" class="scrollbar disable">
                          <div style="height: 354px;" class="track">
                            <div style="top: 0px; height: 354px;" class="thumb">
                              <div class="end"></div>
                            </div>
                          </div>
                        </div>
                        <div style="width: 100%;" class="viewport">
                          <div style="top: -1px;" class="overview">
                            <ul>
                                                           <li class="projects-list-item selected" isdisabled="false" data-id="0f53ee7c-f894-42dd-b2f7-ddf576a04db1"> <span class="left">My Offers</span> <span class="right"> </span></li>
                              <?php if ($frow = mysql_fetch_array($result)) {

                             do {
                                  $rows = 0;
                             ?>
                               <a href="view_offer.html?id=<?=$frow["softwares_id"];?>">  <li class="projects-list-item"> <span class="left">   <?=ucwords($frow["software_name"]);?></span></li></a>
                              <?php
                             $rows++;
                                 } while (($frow = mysql_fetch_array($result)) && ($rows < $recordsPerPage));
                               } 
                               if($noRecords==0){
                               ?>
                              <li class="projects-list-item" isdisabled="true" data-id="0f53ee7c-f894-42dd-b2f7-ddf576a04db1"> <span class="left">No records found.</span> <span class="right"> </span></li>
                              <?php }?>
                            </ul>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div id="project_details" style="display: table-cell; vertical-align: top;">

                    <h1><strong>Create Your Offer </strong></h1>
                    <p><br>
                    </p>
                    <p>Advertising through <?php echo SITE_NAME; ?> is ideal for software companies and developers looking to promote many types of apps including: <br>
                    Tool bars, Search engines,Browsers, Browser extensions, Desktop widgets, AV software, Coupon and shopping alert <br>
                    systems and many others.</p>
                    <p><br>
                    </p>
                    <table width="767" border="0" cellpadding="5" cellspacing="5">
                      <tbody>
                        <tr>
                          <td width="115"><img src="img/SDK_BOX_16.jpg"></td>
                          <td width="617"><ul>
                            <li>Reach millions of new users from the far corners of the Internet who choose to install your app</li>
                            <li></li>
                          </ul></td>
                        </tr>
                      </tbody>
                    </table>
                    <table border="0" cellpadding="5" cellspacing="5" width="767">
                      <tbody>
                        <tr>
                          <td width="114"><img src="img/SDK_BOX_15.jpg"></td>
                          <td width="618"><ul>
                            <li>Cost-effective software pay per install distribution, Reach the largest possible audience</li>
                            <li></li>
                          </ul></td>
                        </tr>
                      </tbody>
                    </table>
                    <table width="767" border="0" cellpadding="5" cellspacing="5">
                      <tbody>
                        <tr>
                          <td width="114"><img src="img/SDK_BOX_13.jpg"></td>
                          <td width="618"><ul>
                            <li>Built-in A/B testing and analytics to track and optimize performance.</li>
                          </ul></td>
                        </tr>
                      </tbody>
                    </table>
                    <table width="767" border="0" cellpadding="5" cellspacing="5">
                      <tbody>
                        <tr>
                          <td width="114"><img src="img/SDK_BOX_14.jpg"></td>
                          <td width="618"><p><br>
                          </p>
                            <ul>
                              <li>Strongest anti fraud system to ensure you are only paying for installations by real users</li>
                            </ul></td>
                        </tr>
                      </tbody>
                    </table>
                    <h1>&nbsp;</h1>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                    <p>&nbsp;</p>
                  </div>
                </div>
              </div>   </div>
            </div>
            <div style="display: none;" id="ajaxLoadingModalBox">
              <div style="z-index:2000;" id="ajaxLoadingModalBox_shade" class="rf-pp-shade">
                <button id="ajaxLoadingModalBoxFirstHref" class="rf-pp-btn" tabindex="-1"> </button>
              </div>
              <div id="ajaxLoadingModalBox_container" class="rf-pp-cntr ">
                <div id="ajaxLoadingModalBox_shadow" class="rf-pp-shdw" style="opacity: 0.1; width: 72px; left: 5px; top: 5px; bottom: -5px;"></div>
                <div id="ajaxLoadingModalBox_content_scroller" class="rf-pp-cnt-scrlr" style="width: 72px; height: 72px;">
                  <div style="background-color: inherit;padding:0px;" id="ajaxLoadingModalBox_content" class="rf-pp-cnt">
                    <div style="padding:20px"> <img style="width:32px; height:32px;" src="img/page-spinner.gif"> </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

这是一些css代码:

/* --------------------------- common.css ------------------------------------- */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/opensans-bold-webfont.woff') format('woff');
    font-weight: bolder;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/opensans-semibold-webfont.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/opensans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/opensans-light-webfont.woff') format('woff');
    font-weight: lighter;
    font-style: normal;
}

@media print {
    body * {
        visibility: hidden;
    }

    .printable,
    .printable * {
        visibility: visible;
    }

    .printable {
        position: absolute;
        left: 0;
        top: 0;
    }
}

html, body, iframe,
h1, h2, h3, h4, h5, h6, p, a, dl, dt, dd, ol, ul, li,
fieldset,  label, img, input,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    border-spacing: 0;
    font-size: 14px;
}

/* firefox line-height fix */
button::-moz-focus-inner,
input::-moz-focus-inner {
    padding: 0;
    border: 0;
}

body {

    background-color: #474141;
    color: #469965;
    height: 100%;
    margin: 0;
    overflow-x: hidden;
    font-family: 'Open Sans', Arial, Tahoma, sans-serif;
    font-size: 15px;
    line-height: 1.4;
    overflow-x: hidden;
    box-sizing: border-box;

}

.header-green-line {
    height: 5px;
    background: #609e79;
}

h1 { 
    font-size: 22px; font-family: 'Open Sans', Arial, Tahoma, sans-serif;
    line-height: 1;
    color: #003333
}

h2 {
    font-size: 18px;
    font-weight: normal;
}

a,
input {
    outline: medium none;
}

label {
    display: inline;
}

a {
    cursor: pointer;
    text-decoration: none !important;
    font-size: 14px;
}

a,
a:visited {
    color: #FFFFFF;
}

a:hover {
    color: #95c8aa ;
}

ol, ul {
    list-style: none;
}

.list-inline > li {
    display: inline-block;
    line-height: normal;
}

.container {
    margin: 0 auto;
    width: 1240px;
}


.container:after {
    clear: both;
    content: " ";
    display: block;
    height: 0;
    overflow: hidden;
    visibility: hidden;
}

#project_tab,
#app_console_tab,
#plugin_tab {
    padding: 40px;
    padding-right: 35px !important;
    border: none;
}

.extend-full,
.extend-left {
    padding-left: 3000px;
    margin-left: -3000px;
}

.extend-full,
.extend-right {
    padding-right: 3000px;
    margin-right: -3000px;
}

#warning_banner {
    background: #AD2535;
    color:white;
    text-align: center;
    line-height: 30px;
}

#app_content {
    background-color: #FFFFFF;
}

#app_approval {
    position: relative;
    width: 200px;
    height: 115px;
    z-index: 1;
    left: 1755px;
    top: 329px;
}
.tiggzi_btn, input.tiggzi_btn, button.tiggzi_btn {
    display: inline-block;
    position: relative;
    top: -1px;
    border: 0 none;
    border-radius: 3px;
    cursor: pointer;
    color: white;
    font-size: 16px;
    line-height: 16px;
    text-align: center;
    box-shadow: 0 px 0 rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
    padding: 12px 18px;
    margin: 0;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
}





    /* Projects page */

    #projects_sidebar {
        float: left;
    }

    /* Projects list */

    #projects_list_search {
        display: block;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        margin-bottom: 10px;
        border-radius: 3px;
        padding: 7px 25px 7px 15px;
        background: white url(../img/search-icon.png) no-repeat 98% 50%;
        font-size: 16px;
        width: 270px;
    }

    #projects_list_search::-ms-clear {
        display: none;
    }

    .projects-list-item,
    .databases-list-item,
    .collections-list-item {
        padding:  3px;
        height: 30px;
        border-radius: 3px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        cursor: pointer;
        font-size: 16px;
        color: #FFF;
        border-bottom: 1px solid white;
    }

    .projects-list-item span.left,
    .databases-list-item span.left,
    .collections-list-item span.left{
        overflow: hidden;
        text-overflow: ellipsis;
        width: 100%;
        line-height: 45px;
    }

    .projects-list-item:hover span.left,
    .databases-list-item:hover span.left,
    .collections-list-item:hover span.left {
        width: 79%;
    }

    .projects-list-item span.right,
    .databases-list-item span.right,
    .collections-list-item span.right{
        padding-top: 13px;
        padding-right: 10px;
    }

    .projects-list-item.selected,
    .databases-list-item.selected,
    .collections-list-item.selected {
        color: black;
        font-weight: bold;
    }

    .projects-list-item.selected:hover,
    .databases-list-item.selected:hover,
    .collections-list-item.selected:hover {
        /*color: black;*/
    }

    .system-collection-selector, .custom-collection-selector {
        margin: 0 20px;
    }

    .system-collection-selector .collections-list-item.selected:hover {
        color: black; /* Don't highlight system collection name on mouse hover */
    }

    .projects-list-item:active,
    .databases-list-item:active,
    .collections-list-item:active {
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3) inset;
    }

    .projects-list-item button,
    .databases-list-item button,
    .collections-list-item button,
    .libs-table button,
    .scripts-table button {
        display: none;
    }

    .projects-list-item:last-child,
    .databases-list-item:last-child,
    .collections-list-item:last-child {
        margin-bottom: 0;
    }

    .collections-list-item:last-child {
        border-bottom: none;
    }

    .projects-list-item:hover,
    .databases-list-item:hover,
    .collections-list-item:hover,
    .scripts-table tr:hover,
    .libs-table tr:hover {
        color: #95c8aa ;
        background-color: #507f63;
    }

    .projects-list-item:hover button,
    .databases-list-item:hover button,
    .collections-list-item:hover button,
    .libs-table tr:hover button,
    .scripts-table tr:hover button {
        display: inline-block;
        padding: 2px 5px;
        font-size: 10px;
        font-weight: normal;
    }


    .projects-list-item img,
    .databases-list-item img,
    .collections-list-item img{
      padding-right: 5px;
      float: left;
    }

    #users-collection-item span:before {
        display: inline-block;
        content: " ";
        width: 23px;
        height: 14px;
        background: url("../img/users_collection_icon.png") no-repeat left center;
        margin-right: 10px;
        background-position: 0 0;
    }

    .selected#users-collection-item span:before {
        background-position: 0 -14px;
    }

    #files-collection-item span:before {
        display: inline-block;
        content: " ";
        width: 14px;
        height: 17px;
        background: url("../img/files_collection_icon.png") no-repeat left center;
        margin-left: 4px;
        margin-right: 14px;
        background-position: 0 0;
    }

    .selected#files-collection-item span:before {
        background-position: 0 -17px;
    }

1 个答案:

答案 0 :(得分:0)

我希望clearfix类有溢出:隐藏;但我不知道是否在提供的CSS中。在浏览器上按F12打开开发人员工具,然后使用元素选择器获取项目列表的包含div。然后,您将能够根据类查看应用了哪些样式。然后你就会知道需要改变什么。