【webデザイン】ブラウザ表示で出現する謎の隙間と解決方法について

最近作成しているHPで、ブラウザで表示すると、謎の隙間が出現してしまう現象に出くわしました。念のため、自分の備忘録のためにも解決策を記します。誰かのお役に立てれば、幸いです。

————————————————
■ 謎の現象 その1(左右上下パターン)
————————————————

制作したHPが、Chromeではきちんと表示されるのに、Safariで左右上下になぞの隙間が出来る

《解決方法》
body タグに、margin 0, padding 0 の要素を加えると、謎の隙間が消えて解決。

《備考》
ブラウザによって、ベースとなる設定が異なるため、このような現象がおきるようです。margin paddingのリセットです。

————————————————
■ 謎の現象 その2(右側パターン)
————————————————

制作したHPをブラウザで確認すると、右に謎の隙間が出来る。

《解決方法》
body タグに、overflow: hidden; の要素を加えると、謎の隙間が消えて解決。

《備考》
他のブログでbodyタグを別で囲んで(ラップして)、その要素にoverflow: hidden;すれば良いと書いてあるのを見ましたが、bodyタグに加えることで、解決しました。

以上です。