幅 240px の parent クラスの中に幅 80 px の child クラスを横並びに 3 つ並べたいときは次のようにする。
.parent {
width: 240px;
}
.child {
display: inline-block;
vertical-align: top;
width: 80px;
}
vertical-align を top にすると child クラスの要素が上でそろえられる。ポイントは次の二つ。
- display は inline-block
- 親要素と子要素のそれぞれに width を設定する（重要）
