CSS max-width

[Muskie]

Hey,

So I've got a .swf (150px tall x 800px wide) anchored to the bottom left corner of my page, and it has a gradient running from top to bottom across its width. What I'd like to do, is repeat a 150x1px gradient across the rest of the page (from 800px -> wherever the users stretches the window too).

This is the code i have now:

#footer {
	background-image: url(imagesetc/bottomBar.png);
	background-repeat: repeat-x;
	position: absolute;
	left: 800px;
	bottom: 0px;
	width: 100%;
	height: 150px;
}

but that just seems to add an 800px repetition of the image.

i thought maybe using max-width somehow would work, but can't seem to get that working either. using max-width, i never even get the image to show up at all.

Any ideas?

p.s. as a sidenote, the gradient looks almost entirely black on other people's monitors. am i going to have to do this a totally different way for it to work correctly (im guessing flash is displaying the gradient a little differently than the actualy gradient image im repeating)?

 

[Makosuke]

Maybe I'm not visualizing the page correctly, but couldn't you just set the background of the body (or whatever containing div is at the bottom of it) as:

background-repeat: repeat-x; background-position: bottom left;

...that'd end up tiling the image across the bottom of the element, which will cover the whole width of the window if it's set to width: 100% (or, alternately, if you don't need a background image for the page itself, you can just apply it to the body and be done).

I've done exactly what you're trying to do before, and I'm not quite seeing where it's not working for you, so if you've got a link to an example it would help...