在asp.net中打开selectbox(jquery)时出现故障

时间:2013-09-02 11:38:13

标签: jquery html asp.net css

我有一个包含食物类型的选择框。问题是,当我尝试打开它时,选择框的样式不会加载到网页的底部。我的英语不是很好所以我拍了两张截图:

首先我点击选择框: http://postimg.org/image/4r5hm13pr/

然后,我将页面滚动得更低: http://postimg.org/image/64x4hc2z3/

正如您所看到的,还有另一个元素无法看到。他们的css属性没有加载。

这是我的HTML代码:

      <div class="cont-data clearfix">
//some list elements here

<li>               

     <div style="float: left;">
                        <div class='long-select'>
                        <select class="pyemek" id="pyemek" style='font-size:x-small'>
                            <option />
                            <option value="AVML">Asya Vejetaryen</option>
                            <option value="BBML">Bebek</option>
                            <option value="DBML">Diabetik</option>
                            <option value="FPML">Meyve Tabağı</option>
                            <option value="GFML">Glütensiz</option>
                            <option value="HFML">Yüksek Fiber</option>
                            <option value="HNML">Hindu</option>
                            <option value="KSML">Koşer</option>
                            <option value="LCML">Düşük Kalori</option>
                            <option value="LFML">Düşük Yağ / Kolesterol</option>
                            <option value="LPML">Düşük Protein</option>
                            <option value="LSML">Düşük Sodyum</option>
                            <option value="MOML">Müslüman</option>
                            <option value="NLML">Laktozsuz</option>
                            <option value="ORML">Oryantal</option>
                            <option value="RVML">Çiğ Vejetaryen</option>
                            <option value="SFML">Deniz Besinleri</option>
                            <option value="SPML">Özel</option>
                            <option value="VGML">Vejetaryen</option>
                            <option value="VLML">Vejetaryen Lakto / Ovo</option>
                        </select>
                    </div>
    </div>
            </li>

//some list elements
</div>    

这是我的“长选”类'css:

.long-select { position:relative; width:169px; height:27px; }
.long-select .sbHolder { background:url(../../images/core/long_select.png) no-repeat left top; position:absolute; left:0; top:0; width:169px; height:27px; z-index:1000; }
.long-select .sbHolder .sbSelector { display:block; width:100%; height:100%; font:12px/2em PNSemiBold; color:#FFF; text-indent:5px; }
.long-select .sbHolder .sbOptions { background:#003b75; position:absolute; left:0; top:108% !important; z-index:9999; border-radius:6px; padding:3px 0; }
.long-select .sbHolder .sbOptions li { float:left; display:block; width:100%; height:20px; padding:3px 0; }
.long-select .sbHolder .sbOptions li a { font:13px/1.2em PNSemiBold; color:#FFF; display:block; width:100%; height:100%; text-indent:8px; }

有什么想法吗?

编辑:这是我可能需要的另一个css:

#section .flyListData .tableData .cont-data {
    background:#f4f4f4;
    margin-top:5px;
    padding:10px 8px;
    border-radius:6px;
}
#section .flyListData .tableData .cont-data li {
    float:left;
    display:block;
}

0 个答案:

没有答案