# CSS - Drop Shadow

**URL:** <https://forum.kirupa.com/t/css-drop-shadow/205173>\
**Category:** web dev\
**Created:** [October 26, 2006, 8:46pm UTC](https://forum.kirupa.com/t/css-drop-shadow/205173 "2006-10-26T20:46:38Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![bladeMX](https://avatars.discourse-cdn.com/v4/letter/b/46a35a/32.png) [@bladeMX](https://forum.kirupa.com/u/bladeMX)\
**Post date:** [October 26, 2006, 8:46pm UTC](https://forum.kirupa.com/t/css-drop-shadow/205173/1 "2006-10-26T20:46:38Z")

</div>

Hello,

Here is the layout I’m referring to:  
[http://www.cingular.com/cell-phone-service/welcome/?\_requestid=62814](http://www.cingular.com/cell-phone-service/welcome/?_requestid=62814)

I’ve been able to figure out the drop shadows for the sides and bottom.

I can’t seem to find out how they did the top shadow… looked at the index, css pages with no reference to any top shadow. So I tried replicating the bottom for the top, and although it worked on the mac, on a pc with internet explorer it does not display properly.

Any idea? 🏒

Sides:

```auto

#sidesShadow {
  	padding:0;
    margin: 0 auto;
  	width:760px;
	height: 100%;
  	margin-left: auto;
	margin-right: auto;
	background: url(images/page_midSlice.gif) 0 0 repeat-y transparent;

}

```

Top:

```auto

#btmContainer
{
	clear:both;
    margin: 0 auto;
    width:760px;
    height:5px;
    background: url(images/page_btmSlice.gif) 100% 100% no-repeat transparent;
}

```
