訓練校で、floatした際の親要素にoverflow:hidden;
を入れるという神業を教えてもらい、
以降愛用してたのが…
先日それが効かない場面に遭遇。
いや、効いてるんだけど、子要素がちょん切れるという現象。
う〜んどーしたもんかと思い、
overflowの代わりにclearfixを使ったが、やっぱりちょん切れる。
ちなみにその切れてしまう子要素は、pタグにdisplay:inline;
border:2px solid #333333;
をつけたもの。
文字をワクで囲いたかったのね。
で、そのp要素の上のborder
が切れてしまうのだけれど…
overflow: hidden;
を外すと
子要素は見えるけれど、親要素の高さが出ない。
結局どーやって解決したかというと、p要素の
× display:inline;
○ display:inline-block;
にしました。
でもこれだとIE7では見れないんだーーーー(泣)
無限ループにはまってます(泣)
コメント