3

親コンテナがあり、その中に子コンテナがあります。2つの子コンテナはそれぞれ60%の幅と40%の幅を占めます。余白はなく、パディングもありますが、幅に含まれるようにボックスサイズを使用しています。しかし、何らかの理由で彼らは並んで座っていません。そのうちの1つを39%の幅に変更すると、問題なく表示されます。

私は何が間違っているのですか?

例はhttp://jsfiddle.net/Rcaet/で見ることができます

4

3 に答える 3

3

デフォルトでいくらかのスペースがあるdisplay:inline-blockを使用しています。これには、font-size:0ハックを使用する必要があります。次のように書きます。

.parent-container {
    font-size:0;
}
.parent-container > div{
    font-size:16px;
}

これをチェックしてくださいhttp://jsfiddle.net/Rcaet/8/

于 2012-09-04T10:07:59.260 に答える
0

あなたは「間違った」ことを何もしていません。あなたbordersも取り上げwidthます。したがって、境界線があるということは、ボックスを小さくする必要があることを意味します。したがって、39%

于 2012-09-04T10:01:15.707 に答える
0

フローティングを追加する必要があります。コンテナー 2 と 3 の両方に a を追加しfloat: leftます。ただし、一部のブラウザーでは境界線の幅が原因で問題が発生する可能性があります。したがって、実際には、ボックスの 1 つを減らします。

于 2012-09-04T10:04:55.330 に答える