webページでは図と字は何も考えずにタテに配置していればよかったが、プリントを作成すると図と字を狭いスペースに押し込む必要が出てくる。
そこで今まで使ったことがない「float」を使うことがおおくなってきた。
その経験をwebにも使おうとすると(主にPCとモバイルのレスポンシブ表示)問題が出てきた。
問題:高さが無くなる
字が少ない場合、PC表示では図の高さよりも小さくなり親要素(ボックス)の高さも図より小さくなる結果、図が親要素をはみ出てしまう
解決策
親要素のCSSに「overflow:auto;」を設定すると自動で高くなってくれる♪