ページ下部の余白について

Question

こんにちは。
現在スマホサイトを作成しながら勉強中です。

• html body{
  overflow: hidden;

}

こちらをCSSに使い、はみ出た部分が隠れるようにすることはできました。
この場合、画面下部めいっぱいまでページ内容が表示され、残りは隠れていますが、
下部に例えば100PXなど余白を設けることは可能でしょうか？

うまく説明できないのですが、ページをめいっぱい表示ではなく、
下部に余白をもたせ、そこを避けてページが表示される形です。

どうぞよろしくお願いします。

Answer 1

padding利用してみてください。

Comments

[misa505]

ありがとうございます。
paddingを設定すると、ページ最下部に余白はできるのですが・・・
ページ最下部ではなく、見える範囲で余白を持たせることは可能でしょうか？

[m.ts10806]

その「見える範囲」というのがよくわかりません。
おそらく文字での説明では難しいと思いますので、図示してもらえますか？

[misa505]

説明が下手ですみません。。
たとえば、表示されているページを下から100px分隠すとしますよね。
すると、めいっぱいコンテンツが表示されていた場合、100ｐｘ隠れてしまいます。
それを100ｐｘを避けて、その上部から表示させることは可能なのかな？ということです。

＠コンテンツ部分が少ない場合は、paddingやmarginで、下部を空けることはできるのですが・・・