Not sure if this is even doable with CSS, but here goes...

I have a picture - head and torso, that I removed the background from, 
added a shadow, and saved as a png with alpha transparency.

It is about 520 x 520 px.  I set it to be fixed position at the bottom 0 
and left 0 - and a z-index to place it in front of everything.

It looks great (to me) when I look at it on a screen with 1024x768 
resolution screen it gives me just the effect I am after.

Examole:  http://tinyurl.com/yfl8nb8

But if someone looks at it in a smaller window - say 800 x600 then the 
image is too large and ends up blocking too much of the text behind it.

Basically what I am after is that whatever size the window is, I would 
like to resize the image (without a lot of distortion) so that it was 
roughly about one fourth of the usable view port.

Is there a  way to resize the  image using CSS that will work in most 
current browsers.  I am really not concerned about IE6 - mainly want to 
address users of FF and IE7 and up.  If CSS can't do this, is there 
something else that would be worth investigating?

Thanks for any info you can provide or links you can point me to.






______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to