PDA

View Full Version : Shadows


Blue_Vision
02-08-2010, 04:56 PM
I wanted a CSS drop shadow on my main content box but I can see that the CSS wouldn't be compatible with IE 6 & 7. So, I'm guessing a png is the best idea. It is a completely simple gray box for the main content with a 1px outline around the sides and bottom & about a 2-3 px drop shadow on the sides and bottom.

I guess my problem is that I was hoping not to have to create multiple images for each webpage. I was hoping it would be vertically auto resized so that I also don't have to create a separate main content div for each page (due to different images).

What is the best way to approach this? Using 1 css main content div and then changing which background image each time in the html itself? Am I overlooking something? Is there a simpler way to do this while still being compatible with IE 6 and at least 7?

Thanks!

Corrosive
02-08-2010, 06:15 PM
Just create a thin slice of box shadow and then repeat-y.

Blue_Vision
02-09-2010, 12:56 AM
problem with that is that is the bottom of the gray box has a 1px stroke (our outline) and then a drop shadow. I see how your solution would work for the left and right sides but not the bottom. Am I confused?

Corrosive
02-09-2010, 06:12 AM
Ah right. I see you problem. Yes, my way means having the page stretch from top to bottom with no drop on the bottom edge. Sorry dude. I'd say CSS3 but you want it to work in IE so I'm fresh out of ideas.

Blue_Vision
02-09-2010, 11:11 PM
The reason I wanted it to be compatible with IE so much is because the site is for a targeted group of aged individuals and I'm guessing that alot of them probably have IE 6.

Thinking about it though... Without the drop shadow it still looks decent so I guess the worst that would happen with using the drop shadow in the CSS is that it just won't show up for the IE users but yet it will still look nice. Are there any other downsides other then not showing up? Not meaning the minority browsers but I mean in reference to it actually displaying funky on non-compatible browsers? Will it display like IE6 display's png... have a frame around it or anything?

Thanks, I'd check myself right now but I don't have windows around me ATM.

Corrosive
02-10-2010, 07:43 AM
The reason I wanted it to be compatible with IE so much is because the site is for a targeted group of aged individuals and I'm guessing that alot of them probably have IE 6.

Thinking about it though... Without the drop shadow it still looks decent so I guess the worst that would happen with using the drop shadow in the CSS is that it just won't show up for the IE users but yet it will still look nice. Are there any other downsides other then not showing up? Not meaning the minority browsers but I mean in reference to it actually displaying funky on non-compatible browsers? Will it display like IE6 display's png... have a frame around it or anything?

Thanks, I'd check myself right now but I don't have windows around me ATM.

IE6 or others just ignore the CSS3 rules. You don't get any negative effects. Also reckon you'd be surprised how many silver surfers are browser savvy. My Dad uses Firefox all the time :)

gentleone
02-10-2010, 04:43 PM
silver surfers

hahaha... this one is new to me :)

Corrosive
02-10-2010, 04:45 PM
I think there is a member here with that name. It might be a Brit thing.

gentleone
02-10-2010, 04:46 PM
I think there is a member here with that name. It might be a Brit thing.

I wonder how old he is then :roll:

edbr
02-10-2010, 11:40 PM
should be my name i reckon

edbr
02-11-2010, 06:58 AM
temp change of avatar just to prove my claim :)

domedia
02-11-2010, 01:49 PM
I think we all should follow Ed's example :)

gentleone
02-11-2010, 02:06 PM
I think we all should follow Ed's example :)

Okay... I'll have to dig into my photo albums to claim that I'm not a silver surfer (yet)... well a few grey ones :)

Corrosive
02-11-2010, 03:53 PM
Ed has a face...!!!

edbr
02-12-2010, 12:29 AM
my ex wife seemed to think i have two