スマートフォン : ページ最下部に謎の隙間が出る場合の注意点 | MJ-WAVE.COMスマートフォン用ページを構築している際、 タイトルのような壁にブチ当たった。 ページの最下部に余白が出来てしまった。 原因を探してみると、 「最後の要素にクリアフィクスをかけている」と上記のような現象がおこるみたい。 クリアフィクスと言えばこんなやつだよね。 .clearfix:after { height: 0; visibility: hidden; content: "."; display: block; clear: both; } 最後の要素に限り、これを使うと変なことになるから、 代わりに僕はクリアフィクスを掛けたい要素にoverflow:hiddenを指定して対処した。
IE8以降のバージョンでレンダリングモードをmeta要素で指定する時のまとめ | MJ-WAVE.COM
