■Tableレイアウト
HTMLのtableタグで表を作成してレイアウトする方法、現在はほとんど使われない
<table>
<tr>
<td>
</td>
</tr>
</table>
■CSS float Property
cssのプロパティfloatで要素を回り込ませてレイアウトする方法
#left{
float: left;
}
#right{
float: right;
}
<div id=”left”></div>
<div id=”right”></div>
<clearプロパティ>
both = 左右両側の回り込みを解除
left = 左端に配置されたブロックに対する回り込みを解除
right = 右端に配置されたブロックに対する回り込みを解除
none = 回り込みを解除しない（標準）
■display:table-cell
table-cellプロパティを使って組む方法
IE8以降
.tbl{
display:table;
}
.cell{
display:table-cell;
vertical-align:middle;
text-align:center;
}
<div class=”tbl”>
<p class=”cell”>リストA</p>
<p class=”cell”>リストB</p>
</div>
■CSS Flexible Box Layout Module（flexbox）
フレキシブルボックス(flexbox)を使って並べる方法
可変のボックスで、コンテンツのレイアウトをスクリーンサイズや
デバイスのディスプレイサイズに柔軟に対応させることが可能
IE9は未対応
IE10はdisplay:-ms-flexbox
IE11ではflex:1ではなくflex-grow：1
ブラウザ依存で問題がある場合がある
■CSS Grid Layout
Flexboxよりも新しいレイアウトの仕様
Tableレイアウトに近い考え方で2次元レイアウトをCSSのみでレイアウトが可能
IE11(Edge)はIE10からの古い仕様でCSS Grid Layoutが実装されており導入しずらい
ブラウザ依存で問題がある場合がある