■原因として考えられるもの
clearfixハック
■解決策(CSSソース)
.clearfix:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size: 0;/*これで解決させる*/ }
とする
■解説
afterでコンテンツ(上記の場合は『.』)を追加した分、(hight:0であるが)内部的に高さが増す。フッターにclearfixハックを使っている、もしくは他の要素でclearfixを使い内部的に高さが増した量よりフッターの高さが小さい時にフッタの下に隙間が出来るが、上記のafterで追加した要素のフォントサイズを0にすることにより、追加した要素の高さを完全に0にする。
■追記
但し、スパムとみなされる可能性もある気がするので、フォントサイズはかなり小さめの0以外の値を設定した方がイイかもしれない。
.clearfix:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size: 0.1em; }
すごく役立ちました
ありがとうございますm(_ _)m
いえいえ。
お役に立てましてなによりです☆
今後とも宜しくお願いいたします。
ピンバック: Firefoxで空白ができるのは回り込み解除が不完全だった | helog - Webに悩む人のネタ帳