Question

所以这发生在我的选择框中：

enter image description here

注意没有滚动条，它一直打开到IE8中的窗口标题。这不会发生在Webkit或FF上。

HTML：

     <div class="fblock">
            <label>Municipios</label><br />
            <select name="municipality" id="municipality" class="selector">
                <!-- todo: fill with municipalities-->

                    <option value="Aguada">Aguada</option>

                    <option value="Aguas Buenas">Aguas Buenas</option>

                    <option value="Arecibo">Arecibo</option>

                    <option value="Bayamón">Bayamón</option>

                    <option value="Cabo Rojo">Cabo Rojo</option>

                    <option value="Caguas">Caguas</option>

                    <option value="Canóvanas">Canóvanas</option>

                    <option value="Carolina">Carolina</option>

                    <option value="Cayey">Cayey</option>

                    <option value="Cidra">Cidra</option>

                    <option value="Dorado">Dorado</option>

                    <option value="Fajardo">Fajardo</option>

                    <option value="Guayama">Guayama</option>

                    <option value="Guaynabo">Guaynabo</option>

                    <option value="Gurabo">Gurabo</option>

                    <option value="Hatillo">Hatillo</option>

                    <option value="Humacao">Humacao</option>

                    <option value="Manatí">Manatí</option>

                    <option value="Mayagüez">Mayagüez</option>

                    <option value="Ponce">Ponce</option>

                    <option value="San Juan - Condado">San Juan - Condado</option>

                    <option value="San Juan - Hato Rey">San Juan - Hato Rey</option>

                    <option value="San Juan - Río Piedras">San Juan - Río Piedras</option>

                    <option value="San Juan - Santurce">San Juan - Santurce</option>

                    <option value="San Juan - Viejo San Juan">San Juan - Viejo San Juan</option>

                    <option value="San Sebastián">San Sebastián</option>

                    <option value="Toa Alta">Toa Alta</option>

                    <option value="Trujillo Alto">Trujillo Alto</option>

                    <option value="Yauco">Yauco</option>

            </select>
        </div>

CSS：

select.selector {padding:2px 5px;
    border:1px solid #56AB4E; -moz-border-radius:.2em; -webkit-border-radius:.2em; border-radius:.2em;}
select.selector:focus {
    box-shadow:0 0 5px #77BE5E; -moz-box-shadow:0 0 5px #77BE5E; -webkit-box-shadow:0 0 5px #77BE5E;}
div.fblock {display:inline-block; float:left; padding:0px 10px 10px 0px}
div.fblock.button {margin-top:10px}
div.fblock-container {clear:both; float:none; display:block; width:100%}

对发生的事情有任何想法？我已经看到一些处理IE7修剪问题的例子，但事实并非如此。 IE8中的兼容模式也无法修复它。

我确定这是一些我忽视的CSS属性，但我很难过。

Answer 1

将此添加到您的css，也许有助于解决问题：

.selector{
    height:100px;
    overflow:scroll;
}

IE8中选择按钮的奇怪显示

1 个答案: