Click to See Complete Forum and Search --> : Using css to make BG, but it doesn't stretch all the way


Kbee
02-21-2007, 06:35 PM
Hello

If you go to

http://www.enhancedwireless.net/Tester.shtml

and scroll down to bottom of page you'll notice that my grey left and right margins stop abruptly and there's white - how can I make the grey body gif extend to as large as anyone may stretch their browser?

And is there a simple way with css to give my center content a drop shadow on the right and left?

Thank you

KB

aswebdesign
02-21-2007, 06:53 PM
You can't stretch a background image.

Your best bet is to set the background-color of the body, to the color at the bottom of the gradient on your page.

Very nice design by the way! :)

Kbee
02-21-2007, 06:59 PM
I guess I'm using the wrong word when I say stretch - I meant I want the gif (which is the reflected grey BG), to continue on down indefinitely as the browser window opens. Maybe I've got something wrong between my wrapper and body css but I don't know what...

Thanks for the design feedback as well, you're the first to see this thing other than myself.

I suppose making a drop shadow is very hard? Not sure how it's done.

KB

aswebdesign
02-21-2007, 07:24 PM
I think what I said in my last post is the fix you want.

Have a look at my site www.examsolutions.co.uk. I've got a background image which is a gradient repeated on the x-axis. This is set ontop of a background-color which is the pale blue.

If this isn't what your after, sorry!

At the moment i'm not a big fan of pure CSS drop shadows because I've found them buggy on different browsers.

Check out http://alistapart.com/articles/cssdropshadows for a tutorial though.

Sorry can't be much more help now, i'm shattered! and off to bed!!

Kbee
02-21-2007, 07:28 PM
Very nice link - I tried what you said, it does work OK, but I thought there was a way to make the gif (via css) expand/contract with the resizing of a window.

Thanks
KB

roondog
02-22-2007, 04:45 AM
Although this won't do exactly what you want you could try putting background-attachment: fixed in your css this will stop the background from scrolling with the rest of the content. with your background it will look similar to this (http://forums.xbox.com/default.aspx?ForumGroupID=17)

Kbee
02-22-2007, 11:32 AM
Yes that's exactly what I was looking for in a fix - thanks much...now if only they would make putting a drop shadow on the master wrapper very easy as it should be.

KB

ray326
02-22-2007, 01:33 PM
Very nice link - I tried what you said, it does work OK, but I thought there was a way to make the gif (via css) expand/contract with the resizing of a window.Maybe another article there will give you some more ideas.
http://alistapart.com/articles/slidingdoors

Kbee
02-22-2007, 01:36 PM
Thanks for the link
KB

• MaNiC MoE •
07-10-2007, 12:12 AM
You could use the background color property
here :


<style type="text/css"
body {background-color:#C0C0C0 ;}
/* You could also write "Gray" as the value */
</style>


By the way, check this out : :D
http://www.webdeveloper.com/forum/showthread.php?t=153891