のdiv：100％が異なる

Question

ている私は幅に設定いくつかのdiv要素のすべてを持っている：私のウェブサイト上で100％：表：

<div id="participate" class="test"> 
    participate 
</div> 

<div id="description" class="test"> 

    <div id="brief" style="display:table-cell"> 
&nbsp; 
    </div> 

    <div id="price" style="display:table-cell"> 
&nbsp; 
    </div> 

</div> 

<div id="bottom" class="test"> 

    <div id="partners" class="test"> 
&nbsp; 
    </div> 

    <div id="content" class="test"> 
&nbsp; 
    </div> 

</div> 

のみ#bottomは、ディスプレイを設定しています。私がボーダーを設定すると、#borderは他のdivよりも2倍に小さく見えます。

#border width：100.3％を設定すると、この解決策は私には再入力されたようです。問題はクロムに存在し、ファイアフォックスには存在しません。

どうして私はそれを取り除くことができますか？

ご了承ください。 border S がwidthの一部されていないデフォルトbox-sizing: content-boxに

Answer 1

https://developer.mozilla.org/en/CSS/box-sizing

div要素。国境がwidthの一部であるdisplay: table力box-sizing: border-boxを、設定Chromeの場合

、。

これは、ここに示されています：一貫性のある2つのdiv Sを作るためにhttp://jsfiddle.net/thirtydot/wsEkc/

最も簡単な方法は、box-sizing: border-box（およびそのベンダー接頭辞変種）を適用することです。

を参照してください：他のdivの内側http://jsfiddle.net/wsEkc/3/