homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

Background Images
Resizing to fit the div they are in

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

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)

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)

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)

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)

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.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved