Adding Shadows

Track this topic | Email this topic | Print this topic

Octember

Posted: Saturday, Apr 30 2005, 19:43

propaganda inc
Group Icon

Group: BUSTED!
Joined: Oct 29, 2004

well... my upcoming site, i've been trying to find the code to add shadows to objects, like deviantart's shadows...

need a little help with the code, still can't get it..

just a little curious, how would you add the shadow code in css?

CODE

div#box {
margin: 20px 20px 20px 20px;
background-color: white;
border: 1px solid #777;
text-align: center;
padding: 10px 10px 15px 10px;
height: 200px:
}

how would i add it to that?

Svip	Posted: Saturday, Apr 30 2005, 19:46
I eat babies Group: Retired Staff Joined: Nov 12, 2001	Just write; "margin: 20px", no need for all that shizzle. And for the shadow, that's an image they use on DeviantART. Background.

Octember

Posted: Saturday, Apr 30 2005, 19:50

propaganda inc
Group Icon

Group: BUSTED!
Joined: Oct 29, 2004

i know that, i'm not that stupid... i already have the picture tiles ready, but how would i add it to that object?

CODE

background-img: url('imagetile');
background-repeat: [dunno what would go here]

get on MSN svip.

edit: the shadow code on deviantart is:

CODE

.shadow-holder {
display:inline-table;
}
.shadow {
display:block;
padding:6px 9px 9px 6px;
background-repeat:no-repeat;
background-position:center;
text-align:center;
}
.shadow:before {
display:none;
content:"nul";
background-image:url("http://sh.deviantart.com/shadow/alpha-000000/5.1-0.6");
}
* html .shadow {
/** Apparently IE will store nonsense attributes like this. Good news for scripting. */
shadow-image:url("http://sh.deviantart.com/shadow/alpha-000000/5.1-0.6");
}
* html .ieshadow {
position:absolute;
z-index:-1;
margin-left:-8px;
margin-top:-8px;
background:#000;
filter:
progid:DXImageTransform.Microsoft.Blur(pixelradius=3,makeshadow=true,shadowopacity=.6)
progid:DXImageTransform.Microsoft.Blur(pixelradius=3)
progid:DXImageTransform.Microsoft.Blur(pixelradius=3)
;
}
/*.deviations .shadow :active,
.aside-left .shadow :active,
.dev-thumbnails .shadow :active,
.dev-list .shadow :active {
position:relative !important;
top:1px !important;
left:1px !important;
}*/
.shadow-holder .shadow {
display:table-cell;
}
* html .shadow-holder, * html .shadow-holder .shadow {
display:inline-block

i don't get it.

This post has been edited by Octember on Saturday, Apr 30 2005, 20:10

0 User(s) are reading this topic (0 Guests and 0 Anonymous Users)

0 Members:

« Next Oldest | Web Design / Programming | Next Newest »