Chrome没有响应CSS

时间:2013-03-05 09:02:11

标签: html css google-chrome

我很难在最新版本的Chrome中使用精选字段。 这一切在Firefox中完美运行,但Chrome只是顽固。 它应该如何在Chrome中使用:

enter image description here

Chrome实际上是如何实现的:

enter image description here

HTML:

<td><!--<input type='text' name='ruum' />-->
<select>
    <option type="text" value="ruum">Uks</option>
    <option type="text" value="ruum">Kaks</option>
    <option type="text" value="ruum">Kolm</option>
</select>
</td>

CSS:

option{ /*works for firefox but not for chrome*/
width:8.5em;
float:left;
}

@media screen and (-webkit-min-device-pixel-ratio:0) { /*doesn't do anything*/
 option{
    width:8.5em;
    float:left;
 } 
}

有什么想法吗?感谢。

3 个答案:

答案 0 :(得分:2)

select上设置宽度,而不是option

select {
    width: 8.5em;
    float: left;
}

此外,option没有type属性。请参阅:http://www.w3.org/TR/html5/forms.html#the-option-element

答案 1 :(得分:1)

设置<select>的尺寸,而不是<option>

select{
    width:8.5em;
    float:left;
}

请参阅此JSfiddle

答案 2 :(得分:0)

尝试将样式应用于select而不是option

小提琴:http://jsfiddle.net/tttp2/