Welcome to WebmasterWorld Guest from

Forum Moderators: not2easy

Message Too Old, No Replies

Background Images

Resizing to fit the div they are in



7:03 pm on Jul 9, 2004 (gmt 0)

10+ Year Member

I would like to have some background images (a gradient) that would resize itself according to how big the div it is in. In other words, text is contained in these table-cell like divs and I want to make a background image large enough to cover many sizes, but to have it look the same in every div by making it proportional in all of them.

Is it possible to stretch (or shrink) a bg image to fit exactly. The only thing I have found possible is to have the bg image be full size.


7:05 pm on Jul 10, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member

As far as I know, there is no way to use CSS to resize background images. You might be able to get the gradient effect you want, however, by using the same background image in each container, positioned the same in each box.

In other words, use the same gradient image in each container, with the same position value on each one, like this...

background: #fff url(image.gif) bottom right;

...This guarantees that the gradient will START at the same location in each box. It won't reach the same lighter shade in shorter boxes, but the look might be uniform enough to suit your purposes.

I haven't tested this, but you might give it a try and see how it looks.


11:56 pm on Jul 10, 2004 (gmt 0)

10+ Year Member

I second what createErrorMsg said,

I think the most straightforward solution would be a javascript one.


12:17 am on Jul 11, 2004 (gmt 0)

10+ Year Member

Could you maybe post a URL with an example of what you have now and perhaps an image of what you'd *like* it to look like? Might help clear up what, exactly, you are looking to do.


1:19 am on Jul 11, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member

regis, WebmasterWorld doesn't encourage (or allow, for that matter) url postings in the forum. To get a url, you'd have to have it "sticky"ed to you using WebmasterWorld's internal mail system.

Featured Threads

Hot Threads This Week

Hot Threads This Month