跨浏览器输入字段宽度样式化

Question

我有一个送货/开票输入表格,我在设计输入字段的宽度相同时遇到了麻烦......

问题:
-a字段<input type="text" size="X" />似乎在不同的浏览器中呈现不同的大小(请参阅链接).
- 此外,选择字段似乎也以不同的方式呈现.
-Chrome/safari似乎没有响应select字段的font-size属性.

关于如何设置文本输入大小和跨浏览器选择字段的任何指导都非常有帮助.

我必须为每个浏览器设置一个不同的sytlesheet ...只为这些输入字段？-谢谢

Answer 1

首先删除内联“size”属性。您应该使用 CSS 来设置输入表单的样式：

input[type="text"] {
    width: 100px;

    /* You can also style padding, margins and everything else,
     * just remember that inputs of type "text" can only be one line. 
     */
}

不要使用 [type="text"] 作为选择器。我只是在本示例中使用它来与“文本”类型的输入字段关联，但它并不完全支持跨浏览器。您应该为文本输入字段提供自己的类来进行样式化。

另外，不要忘记重置 CSS 以确保边距、边框等。等人。为所有浏览器重置。http://meyerweb.com/eric/tools/css/reset/