Question

美好的一天。我对IE8 <select>下拉列表有疑问。我无法访问，点击或选择下拉列表中的项目。只要我将光标放在列表中，列表就会隐藏起来。这种情况发生在IE8上我只尝试使用<!--[if IE 8]>来定位IE8，但我似乎无法解决这个问题。我相信这只是<html>和[CSS]修复。基本上我希望下拉延迟一点，以便用户可以选择列表中的选项。这是我fiddle

的链接

这是我的HTML：

<dl id="checkout-payment-method-load">
    <dd>
        <ul style="" id="payment_form_cybersourcesop" class="form-list">
            <li class="field">
                <label class="required" for="cybersourcesop_cc_type">Credit/Debit Card Type<em>*</em></label>
                    <div class="input-box">
                        <select class="required-entry validate-cc-type-select" name="payment[cc_type]" id="cybersourcesop_cc_type" autocomplete="off">
                            <option value="">--Please Select--</option>
                            <option value="001">Visa</option>
                            <option value="002">MasterCard</option>
                        </select>
                    </div>
                </li>
        </ul>   
    </dd>
</dl>

这是我的CSS：

.checkout-onepage-index .form-list select{
margin: 0 2px 30px 0 !important}

.form-list select{
margin: 0 10px 0 0;
width: 175px;}

select{
 background-color: #FFFFFF;
border: 1px solid #1B191A;
box-shadow: 0 0 2px 0 #1B191A inset;
color: #555555;
font-family: 'foco_corpregular';
font-size: 13px;
height: 25px;
padding: 2px 0 0 5px;
transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;}



label, select, button, input[type="button"], input[type="reset"], input[type="submit"],input[type="radio"], input[type="checkbox"] {
cursor: pointer;}

这是图像

enter image description here

Answer 1

尝试使用Internet Explorer的开发人员工具（键盘上的F12）访问元素选择器工具（它是一个看起来像光标的图标）。然后在该区域周围挥动光标，看看是否存在阻挡它的元素。

可能是信用卡号码元素重叠。

您还可以在实时页面上浏览并取消选择适用的样式，并查看是否有任何内容允许下拉列表变为可选。然后你知道哪种风格在干扰。

Answer 2

美好的一天

我已通过在<head>

中添加以下css解决了此问题

<!--[if IE 8]><style>
 select{
    background-color: #FFFFFF;
    border: 1px solid #1B191A;
    box-shadow: 0 0 2px 0 #1B191A inset;
    color: #555555;
    font-family: 'foco_corpregular';
    font-size: 13px;
    height: 5px;
    padding: 2px 0 0 5px;
    transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
}

感谢那些贡献的人：）

无法从IE8上的Dropdown中选择列表

2 个答案: