IE 8固定宽度选择问题

Question

IE 8固定宽度选择问题

Cly*_*obo 3 html css html-select internet-explorer-8

我必须select在我的html中指定宽度.

除了IE8之外,它在所有浏览器中都能正常工作,IE8会剪切超过宽度的文本

CSS

select {
        border: 1px solid #65A6BA;
        font-size: 11px;
        margin-left: 22px;
        width: 166px;
    }

Run Code Online (Sandbox Code Playgroud)

HTML

<select>
        <option value="1">Some text</option>
        <option value="2">Text Larger Than the Width of select</option>
        <option value="3">Some text</option>
        <option value="4">Some text</option>
        <option value="5">Some text</option>
    </select>

Run Code Online (Sandbox Code Playgroud)

DEMO

我对js,jquery解决方案持开放态度,但更喜欢css解决方案

Answer 1

Cyn*_*hia 10

固定它!

这是经过修改的jsFiddle:http://jsfiddle.net/PLqzQ/

诀窍是将focus选择器添加到CSS中,使其如下所示:

select {
        border: 1px solid #65A6BA;
        font-size: 11px;
        margin-left: 22px;
        width: 166px;
        overflow:visible ;
    }

select:focus { width:auto ;
position:relative ;
}?

Run Code Online (Sandbox Code Playgroud)

我在IE8中进行了测试,它就像一个魅力.

非常重要:您必须向您的代码添加Doctype定义,否则修复将不适用于IE8.

例 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

归档时间：	13 年，5 月前
查看次数：	25876 次
最近记录：	9 年，4 月前