フッターに画像を配置したい。
絶対以外の位置属性を保持すると、画像がフッターの境界を超えてフッターが上部にくっつくという問題があります。
フッターの位置を絶対に保つと、ピクセル単位で特定の位置にする必要がありますが、コンテンツの高さが異なり、特定の位置を指定できません。
<body>
<div></div>
<div></div>
<div></div>
<footer class="effect5">
<img id="fb" src="../images/fbfooter.jpg" />
<img id="email" src="../images/emailfooter.jpg" />
<img id="help" src="../images/helpfooter.jpg" />
<img id="need" src="../images/needfooter.jpg" />
<img id="tos" src="../images/tosfooter.jpg" />
<img id="twit" src="../images/twitfooter.jpg" />
</footer>
</body>
CSSは
footer{
margin:auto;
position:absolute;
bottom:-1850px;
background-image:url(../images/fbg.jpg);
height:360px;
width:1282px;
/*background-size*/
-webkit-background-size:100% 100%;
-webkit-box-shadow:15px 15px 20px #35707E;
border-top-left-radius:100px 100px;
border-bottom-right-radius:100px 100px;
}
img[id=fb]{
position:absolute;
margin-left:600px;
margin-top:150px;
-webkit-box-shadow:5px 5px 20px;
cursor:pointer;
}
img[id=fb]:hover{
}
等々...