[ 印刷用表示 ]
div(ブロック要素)を横に並べる
mj:df >HTML(CSS・web全般) >div(ブロック要素)を横に並べる
div要素を用いると文書要素を指定単位にまとめることができますが、スタイル指定を行わない場合、横幅いっぱいまで領域が確保されてしまい横にdiv要素を並べることができません。
このような場合、float指定を行うことでレイアウトルールを変更します。
下記のような記述を行うとdiv要素を横に並べることができます。
<div style="float: left; width: 100px; ">
text
</div>
<div style="float: left; width: 300px;">
text2
</div>
text
</div>
<div style="float: left; width: 300px;">
text2
</div>
表示例 (上記の定義にborderを追加)
- texttext2
