Menu
Ok, I am very new to css and I read a tutorial on how to make a drop shadow effect on images. The method involves creating 3 divs, with the image file in the innermost, and then 3 shadow image files within each of the 3 divs as well. I tried to create a fourth outermost div with the property margin: 0 auto; so that it would center the whole thing. To see what I mean:
[URL=http://d3kicks.com/css/forum.html]http://d3kicks.com/css/forum.html
For some reason it wont center the whole thing… Here is the code:
<html>
<style>
.wrap0 {
margin: 0 auto;
}
.wrap1 {
float: left;
background:url(shadow.gif) right bottom no-repeat;
}
.wrap2 {background:url(corner_bl.gif) left bottom no-repeat;}
.wrap3 {
padding:0 8px 8px 0;
background:url(corner_tr.gif) right top no-repeat;}
</style>
<body>
<div class= “wrap0″><div class=”wrap1″><div class=”wrap2″><div class=”wrap3″><img src=”logo.jpg” width=”209″ height=”204″ /></div></div></div></div>
</body>
</html>
Can anyone tell me what I am doing wrong, and why the image is not centering on the page…