css - 当我在Firefox中查看页面时，CSS复选框的居中中心没有离开，在Chrome和Safari中工作正常

所以我有一个表单，其中有多个输入文本字段以及一个或两个选择框，然后是3个复选框。一切都在Chrome中正确排列并且看起来很棒，然后我在Firefox中查看，除了复选框之外的所有内容都在对齐，它们在它们的区域居中对齐，而不是像Chrome在左边那样对齐。我试过在它周围放一个额外的div，所有东西似乎都没有破坏它。我在代码中没有看到任何帮助或错误？

表单上的复选框

<div class="blueTable"> - this is for the rest of the form and table
<div class="checkbox"> - this is what I put in to override
<label>Is this a letter?</label>
<input type="checkbox" name="letter" value="YES" class="checkbox"/>

<label>Return label?</label>
<input type="checkbox" name="return" value="YES" class="checkbox"/>

<label>Save destination for future shipments?</label>
<input type="checkbox" name="save_destination" value="YES" class="checkbox"/>
</div></div>

CSS文件

.blueTable input,.blueTable select{
    float:left;
    font-size:12px;
    padding:4px 2px;
    width:400px;
    margin:2px 0 20px 10px;
    text-align: left;
}
.checkbox  {
    text-align: left;
    float: left;
    vertical-align: bottom;
    position: relative;
}

最佳答案

http://jsfiddle.net/MfNdF/这是您要的东西吗？

.blueTable输入使您的复选框的宽度为400像素，这可能会导致问题。

关于css - 当我在Firefox中查看页面时，CSS复选框的居中中心没有离开，在Chrome和Safari中工作正常，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/7689507/