css - Firefox和IE在Chrome中看起来有所不同

我想成为的样式是Chrome，但在Firefox和IE中看起来却有所不同。我的所有字段都浮动在右侧，但字段“名称”除外。关于浮动吗？
 我的Chrome：


我的Firefox和IE：


除“状态”外，还有一个很大的空间，标题的高度也看起来更大。

=== CSS ====

.column-name { margin: 2px; width: 40%; }
.column-priority { float: right; margin: 2px 12px; text-align: center; width: 100px;}
.column-severity { float: right; margin: 2px 12px; text-align: center; width: 100px;}
.column-status { float: right; margin: 2px; width: 100px;}

=== HTML ====

   <div class="results-header ">
        <div class="column-status" value="status">Status<span class="sort jive-icon-sml"></span></div>
        <div class="column-severity" value="severity">Severity<span class="sort jive-icon-sml"></span></div>
        <div class="column-priority" value="priority">Priority<span class="sort jive-icon-sml jive-icon-arrow-generic-down"></span></div>
        <div class="column-name"  value="name" >Name</div>
    </div>

最佳答案

我有99％的把握是因为您需要告诉它具有哪种填充，因为在这些浏览器中它具有更高的优先级。

您可能会制定星规

*{margin:0; padding:0;}

但同样，您需要发布更多代码，然后我才能100％告诉您该怎么做。顺便说一句，如果您不确定与浏览器兼容性有关的任何内容，请参见：http://www.quirksmode.org/css/contents.html