html - 如何使所有浏览器的文本框宽度相同

Question

我有一个固定宽度的文本框。我正在努力解决浏览器兼容性问题。当我在 Firefox 中修复宽度时，Chrome 显示不正确，它向右显示更多长度。

更新了我的代码

HTML

<form name="welcomeDiv1" id="welcomeDiv1">
<tr class="unsortable" >

<tr>
 <td>
<input type="text" class="textbox_form" name="content" id="content" />
</td>

<td>
<input type="text" class="textbox_form2" name="content2" id="content2"/ >
</td>

 <td>
 <input type="text" class="textbox_form3" name="content3" id="content3"/ >
 </td>

 <td>   
  <input type="text" class="textbox_form4" name="content4" id="content4" />
  </td>

<td>
<input type="text" class="textbox_form5" name="content5" id="content5"/ >
</td>

<td>
 <input type="text" class="textbox_form6" name="content6" id="content6" />
 </td>  

<td> <input type="submit" class="textbox_form7"  value="+"  name="submit" class="globalinsert_button"/></td>

  </tr>
 </form>

CSS

.textbox_form {
               margin:0 0 0 1px;
               width:162px;
               height:30px;
               background-color:#C2FFC2;
    }
    .textbox_form2 {
              margin:0 0 0 -3px;
              width:329px;
              height:30px;
              background-color:#C2FFC2;
    }
    .textbox_form3 {
              margin:0 0 0 -3px;
              width:386px;
              height:30px;
              background-color:#C2FFC2;
    }
    .textbox_form4 {
              margin:0 0 0 -3px;
              width:138px;
              height:30px;
              background-color:#C2FFC2;
    }
    .textbox_form5 {
              margin:0 0 0 -2px;
              width:158px;
              height:30px;
              background-color:#C2FFC2;
    }
    .textbox_form6 {
              margin:0 0 0 -2px;
              width:204px;
              height:30px;
              background-color:#C2FFC2;
    }
    .textbox_form7 {
             margin:0 0 0 17px;
    }

我需要在所有浏览器中将文本框完全放置在同一位置。但还是一样的问题

Answer 1

您的样式属性未关闭，请检查。

像这样尝试单独的 css 样式:在每个文本框中添加类 'textbox_form'

<style>
    .textbox_form {
        margin-left: 5px;
        margin-top: 5px;
        width: 150px;
        background-color:#C2FFC2;
    }
    </style>

    <td>
    <input type="text" class="textbox_form" name="content" id="content" border:0px">
    </td>