如何仅使用css显示html选项的选项？

Question

我需要有一个html选项的选项（选项“size”，以便将它可视化为5行textarea）并排显示，就像在这个jfiddle中一样

jsfiddle

我可以使用此css实现我的目标

select {
    width: 100%;
}
select#myselect option {
    width: 6%;
    float: left;
    border: 1px solid;
    text-align: -webkit-center;
    border-color: darkgray;
}

但它仅适用于chrome。在firefox中，选项“float：left”似乎不起作用，选项显示在另一个之下。在Safari中，选项“width：6％”不起作用，选项元素占用选择宽度的100％。边界都不起作用，但这不太重要

可以在所有浏览器中实现相同的chrome结果吗？

编辑：在选项中将“display：inline”添加到firefox上，但是所有内容都在一行上显示，导致最后一个元素根本不显示，就像这样的jsfiddle

Jsfiddle

Answer 1

将display: inline;添加到css。

Answer 2

Safari并不支持inline左侧的inline-block和<option>，而且我认为有充分的理由：首先，导致<select><option>是不是以这种方式工作，并且，因为display:inline与元素本身的iphone渲染完全不兼容; 因此，不支持控制元素with的可能性。