ブラウザのウインドウ下部に画像を固定する方法

質問

Webプログラミングに関する質問です。
ブラウザのウインドウ下部に画像を固定する方法があれば教えて下さい。

例になるサイトが無くて申し訳ないのですが、
まず、webブラウザのウインドウ一面にスクロールなしで画像Aを配置し、
その画像に重なるように、もう一枚の画像B(バナーのような横長のもの)を
ウインドウの底に固定させて配置する方法がわかりません。

「ウインドウのサイズを変更させることで、画像Aが画像Bの下に隠れる」
というページを作りたいのですが、
知恵不足でつまずきました。

説明が下手で申し訳ありませんが、
分かる方がいらっしゃいましたら、よろしくお願いします。

回答No.1

metametamu · ベストアンサー

<div id="parentWrapper">
<div id="childWrapper">
コンテンツ
</div>
</div>

html,
body{
height:100%;
}

#parentWrapper{
height:100%;
background:url(bg01.jpg) repeat-y center top;
}

#childWrapper{
height:auto !important;
height:100%;
min-height:100%;
background:url(bg02.jpg) no-repeat center bottom;
}

お礼

ありがとうございます。とても参考になりました！