DIVを使ったレイアウト(7)

container クラスの幅を75%に変更するとともに,3個目の要素を追加してみよう.

また,スタイルファイルでは各要素の高さを指定しないようにしてみる.

すると次のように,二つの要素が横に並んだものの,2つ目の要素の高さが足りないために,3つ目の要素も右側に配置されてしまいました.

1個目の要素は長めの文章が入力されています.

レイアウトのサンプルを確認するための文章です.じゅげむ じゅげむ ごこうのすりきれ かいじゃりすいぎょの すいぎょうまつ うんらいまつ ふうらいまつ くうねるところに すむところ やぶらこうじの ぶらこうじ パイポパイポ パイポのシューリンガン シューリンガンのグーリンダイ グーリンダイのポンポコピーのポンポコナーの ちょうきゅうめいのちょうすけ.

2個目の要素には短い文章が入力されています.その結果,高さが足りません.

その結果,3個めの要素も右に回り込みます.

前のページへ   次のページへ

目次に戻る