なぜpタグは横に並ばない?
~ブロック要素とインライン要素の話~

この間、文章を横に並べようと思っていたら横に並ばないということがありました。
htmlのタグにはブロック要素とインライン要素があることを初めて知りました。初学者あるあるかもしれませんが、無知って怖いですね、、。

ブロック要素であるpタグで挟んだ場合

実際の記述

<p>横に並べたい文章1</p><p>横に並べたい文章2</p>

横に並べたい文章1

横に並べたい文章2

インライン要素であるspanタグで挟んだ場合

実際の記述

<span>横に並べたい文章1</span><span>横に並べたい文章2</span>

横に並べたい文章1 横に並べたい文章2

 

こうなります。たったこれだけの事を表示させたいだけでもつまづいてしまう。。知識をもっと身につけないとですね><

コメント

タイトルとURLをコピーしました