サイトをぷちブラッシュアップしておりまして、ボタンのロールオーバーやらcss を書き直していたところ、どうもカラムとかボタンのfloatを解除させるための

とかが邪魔くさい感じがするので、いまさらclearfixなるものに挑戦してみたわけですが…

後続に何も無い最終のボックスにこのclearfix技を掛けると、Mac版両ブラウザ、Safari4.0 、Firefox3.5で下に謎マージンが現れてしまいまする。
具体的にはフッターの中にナビがあるとか。
画像は昨夜、検証のために作ったどうでもいいページです。
全体像。
スクロールできるように画面を小さくして…。

スクロールさせると…

紺backのfloat横並びリストの下に謎スペース。
本来なら下にぴったり沿ってほしい。

これを.clearfixに追加で解決するはずなんだけど…

う〜ん、実に惜しい！　1pxくらいの隙間が残ってます。
最終boxをなんだかvisibility: hidden; しないような気がします。
対処方というか、Safari4.0 、Firefox3.5では有効なんですが…

visibility: hidden; のかわりにoverflow: hidden;
line-height:0;もfont-size:0;もいらんです。

と、こうなるわけですが、考え方は変じゃないんですよね。
height:0;のオーバーフローを隠すですから。

ただ、他のブラウザでは検証しておりませんので、使えるかどうかわからず、
自分自身でも使ってないという…すんません。
floatをclearしないとなんとなく気持ちが悪いという理由で、ページ最後のナビに使ったlistのfloatも何とかしたかったんですが、考えて見ればその後に内容が続くことは絶対にないので、floatしっぱなしでもなんら問題はないわけで…現在　さわやかまみれのフッターはfloatしっぱなしです。

後記————————————————–
残念！Win版 Firefox3.53とIE8で確認したところ、無効でした。謎マージンが空いてしまいます。