【CSS】フッターの背景にページトップボタンを被せる

フッターのデザインで見かける、フッターエリアに「PAGETOP」ボタンを重ねるCSSを作りました。

◆HTML

<div id="footerWrap">
<div id="footerContainer">
<p id="topagetop"><img src="img/btn.png" width="170" height="55" /></p>
<p>フッターエリア</p>
</div>
</div>

◆CSS

#footerWrap {
width:100%;
background: url(../img/bg.gif) repeat;
clear:both;
}

#footerContainer {
width:800px;
margin:0 auto;
padding:40px 0;
position:relative;
zoom:1;
overflow:inherit;
clear:both;
}

#topagetop {
position:absolute;
top:-45px;
right:0;
}

余白などは、ボタンのサイズによって調整してください。

サンプルページはこちら