Jump to content

i still dont get css shadows


real_illusions

Recommended Posts

no matter how much i read about it, and try it, i cant seem to grasp the hang of it.nearly all examples i see have explorer hacks, and netscape 4 hacks, and several stylesheets etc etcwhats the simplist way to add a shadow to a div on the right and bottom sides, that fades, on a div that differs in height on each page.if someone can help me out on this, i might send you a christmas card :)thanks:)

Link to comment
Share on other sites

I know what u mean mate, there is however a solution but it is petty complicated.You need to make three images, or perhaps five that really depends on your shadow effects. I introduce the former because that makes it a bit easier to comprehend.What you need to do is create a div that is placed under the div u want the shadow to apply on, within the new div u create three other divs, now here it gets tricky and u need to make sure u understand the concept.First you need one for the right, one for the right-bottom corner and one for the bottom. The images should be placed as background images with settings such as repeat and and top left placement. The div should have no specific height as it holds the other div(s) that will influence it, however, it should be a floatable div!If you apply it like this you will have a nice shadow, and if you really need the code let me know .. for a christmas present i might do a lot :)happy learning

Link to comment
Share on other sites

couldn't you just make a single div...but make like a white box with fading shadows one whole image...so you just have div background, and use padding or margins, whatever tickles your fancy, to put the text or 'content' where you want it?just my idea ;P

Link to comment
Share on other sites

problem with using one image is that its not stretchable, and it may look right for the bottom part, but on the rhs, or even the top part where there is no shadow, it may look horrible.utopia - i understand most of that, but not how to float them into the position required. As i haven't done this before, it'll probably go all hideously wrong :)The other thing is the images, gif is transparent but doesn't support gradients very well, wheres png works fine in everything but explorer.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...