Forums

zemaker

Really like the way css-tricks uses box-shadow for the content div, however when I try to implement it the way it is on this site, in IE8 I get a transparent background instead of the white (as box-shadow is not supported by IE7-8)...any ideas on a nice way to have it get a white background when using IE?

#main-content > .inside {
    background: none repeat scroll 0 0 padding-box white;
    border: 8px solid transparent;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    position: relative;
}

SgtLegend

Have you tried just using the background-color property as what you have above is far to much syntax for a simple background color.

#main-content > .inside {
    background-color: #fff;
    border: 8px solid transparent;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    position: relative;
}

joshuanhibbert

I think you are actually looking for something like this: http://jsfiddle.net/sl1dr/Vue8H

A transparent border will let the background color through, so it won't do what you are after.

zemaker

Looks like that one doesn't degrade nicely for IE...I wonder how they did it here then. I am assuming he must have two different CSS files...one for CSS3 compliant browsers and one for non compliant ones.

Johnnyb

Hey zemaker, you could always use CSS3 Pie. It makes CSS3 properties such as box-shadow work in IE. Super simple to use too.

zemaker

Thanks, but I trying to stay away from anything other than pure CSS, this is for a Lifaray project and I don't want to bother with having to get 3rd party stuff working w/ Liferay.

joshuanhibbert

@zemaker I'm not sure what you mean, it degrades very gracefully in IE, just as the box-shadow used on this site does; it disappears. I assume that you meant to write it doesn't work in IE? If you want IE to work (less than 9) then you need a non-CSS solution.

zemaker

You are actually correct it does degrade well for IE, I spoke too soon. Only issue is that the effect is not as nice, as what is used on this site.

treehouse : what would you like to learn today?

Forums

box-shadow issue