Firefox и IE выглядит по-иному в Chrome

Question

Стиль, который я хотел быть, находится в Chrome, но он выглядит иначе в Firefox и IE. Все мои поля плавают вправо, за исключением поля «name». Это о плавании? My Chrome:

My Firefox и IE:

Существует огромное пространства, кроме "Status" и заголовок выглядит больше в высоту тоже.

=== 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> 

Answer 1

Я 99% уверен, что это потому, что вы должны сказать, какие набивка имеет потому что это имеет более высокий приоритет в этих браузерах.

Вы могли бы сделать звезду правилу

*{margin:0; padding:0;} 

но опять-таки вам нужно размещать больше кода, прежде чем я могу вам сказать 100%, что делать. btw, если вы не уверены в чем-либо, связанном с совместимостью браузера, см .: http://www.quirksmode.org/css/contents.html

Answer 2

всегда использовать css сбрасывает {margin: 0; заполнение: 0; border: 0; outline: 0;} beacuse у каждого браузера есть свой собственный запас, заполнение ...