ネストされていない2つのdivがあり、一方が他方の下にあります。どちらも1つの親div内にあり、この親divが繰り返されます。だから本質的に：
<div id='parent_div_1'>
<div class='child_div_1'></div>
<div class='child_div_2'></div>
</div>
<div id='parent_div_2'>
<div class='child_div_1'></div>
<div class='child_div_2'></div>
</div>
<div id='parent_div_3'>
<div class='child_div_1'></div>
<div class='child_div_2'></div>
</div>私はchild_div_1、それぞれのペアをchild_div_2隣同士にしたいと考えています。これどうやってするの？
回答:
#parent_div_1, #parent_div_2, #parent_div_3 {
width: 100px;
height: 100px;
border: 1px solid red;
margin-right: 10px;
float: left;
}
.child_div_1 {
float: left;
margin-right: 5px;
}http://jsfiddle.net/c6242/1/で実際の例を確認してください
display: table-cell彼の意味に近い結果が得られると思います（それ以降は同じ高さなどになるため）この方法は確実に機能します。
display: table-cellはIE6 IE7ではサポートされていません。float：left; これを行う適切な方法です。
<tr><td>、ユーザーがウィンドウのサイズを変更すると、他のオプションが機能しなくなるためです。最近のブラウザでdisplay: inline-blockは、通常はが最適なオプションです。
divはデフォルトでblock要素であるため、使用可能な幅全体を占めるため、使用してみてください-
display:inline-block;div今すなわち、要素の流れが妨げられることはありませんが、それでもブロック要素として扱われますインラインでレンダリングされます。
このテクニックはfloatsと格闘するよりも簡単だと思います。
詳細については、このチュートリアルを参照してください-http://learnlayout.com/inline-block.html。その記事につながる以前の記事もお勧めします。（いいえ、書きませんでした）
div高さが等しい2つのラッパーを使用して、それらの内部のコンテンツが上揃えで表示されるようにすることをお勧めします。
float:left、レイアウト全体を再定義することなく、非常に多くのオプションを提供するよりもはるかに優れています。物事はこのように「ただ働く」。ここをチェックしてください：jsfiddle.net/SrAQd/4
私は以下のコードが非常に便利であるとわかりました、それはここで検索する人を助けるでしょう
<html>
<body>
<div style="width: 50%; height: 50%; background-color: green; float:left;">-</div>
<div style="width: 50%; height: 50%; background-color: blue; float:right;">-</div>
<div style="width: 100%; height: 50%; background-color: red; clear:both">-</div>
</body>
</html>私にとっては最高です：
.left{
width:140px;
float:left;
height:100%;
}
.right{
margin-left:140px;
}float:left子divクラスのユーザープロパティ
div構造の詳細を確認します。http：//www.dzone.com/links/r/div_table.html