a little story of shadow…

to create some shadows, thers are several alternatives, like images or filter (in IE), but there is another solution. It is very basic but works well.
here an example:

In fact it’s very simple:

here the XHTML code:
There are a lot of tag available to do that…

<dl class="container">
<dd class="shadow"></dd>
<dd class="contentBox"></dd>
</dl>

And here the css:

.container{
position:relative;
width:110px;
height:110px;
}

.shadow{
position:absolute;
top:4px;
left:4px;
background-color: #333333;
width:100px;
height:100px;
}

.contentBox{
position:absolute;
top:0px;
left:0px;
background-color: #ffffff;
border: 1px solid #333333;
width:100px;
height:100px;
}
it’s really basic but it works every time