携帯サイトでbodyにwidth:100%でも空白ができる
今回は携帯サイトについて。
テスト機種はSoftBank 920SHです。
最近、携帯サイトのリニューアルをする機会がありました。
なるべくページサイズを小さくしたいと思い、トップページをスクロールなしで見れるようにしました。
ところが・・・
ページの右側に1mmほどのすき間(空白)が出てきてしまいます。
CSSで
[sourcecode language=”html”]<style type="text/css">
body {width:100%;}
</style>[/sourcecode]
としても変化なし。
[sourcecode language=”html”]<style type="text/css">
body {width:100%;margin:0px;}
</style>[/sourcecode]
でも変わらず。
もしかしたらと思い、
[sourcecode language=”html”]<style type="text/css">
body {width:100%;margin:0px;overflow:hidden;}
</style>[/sourcecode]
とすると、空白がなくなりました。
つまり、スクロールバーの空白だったようです。
スクロールしなければ見れないページであれば、その空白にスクロールバーが表示されます。
しかし、スクロールしなくても見ることができるページでは、スクロールバーが消えて空白になっていたようです。
これは携帯の機種によって挙動がちがうのでしょうか??
あなたのコメントが一番最初です!