html - 如何使文本框宽度在所有浏览器中看起来统一

Question

如何使文本框宽度在所有浏览器中看起来统一？

这是我的代码:

<table>
  <tbody>
    <tr class="att">
      <td>
        <input type="text" class=a /> </td>
      <td>
        <input type="text" class=b /></td>
    </tr>
  </tbody>
</table>

.a {
  margin:6px -116px 9px -7px;w
  idth:190px;
  height:30px;
  background-color:#C2FFC2;
  border:0px
}

.b {
  margin:6px -116px 9px -7px;
  width:190px;
  height:30px;
  background-color:#C2FFC2;
  border:0px;
}

但在 Google Chrome 中，输入框与在 Firefox 中看起来不一样。

是什么导致了这种差异，我该如何解决？

demo

Answer 1

1. 重置 CSS(参见 Erik Meyers CSS 或 others)
2. 仅应用您关心的所有浏览器都支持的 CSS 属性(参见 CanIUse)