float imgがはみ出る→overflow:auto+position:relative

float:leftとかで画像を左に配置しているが、テキスト文量より画像のほうが大きいためdivの下端が画像になる。
するとその下の要素でmargin-heightを指定していても無効になってしまう。

何とかならないかと思い検索するとclearfixという方法を発見。
http://ideahacker.net/2013/07/30/6144/
（上記のページは一例）

しかし、この方法はあくまでdiv要素がはみ出す場合に使えるものらしい。
img要素に対しては無効のようだ。


キーワードを変えて探すと
overflow:auto;　で指定する方法を発見。
http://select-wave.net/images-overflow/

しかし私のHPで同じ方法を試してもなぜか反映されない。

さらに探すとoverflow:auto;が効かない場合の対策ページを発見。
position:relative; が必要となるようだ。
http://senoway.hatenablog.com/entry/2013/07/11/115007

こちらを試すことでようやく望む効果が得られた。