100% div with 3 images.

[brown2005]

		#network { position: absolute; top: 0px; left: 0px; overflow: auto; width: 100%; height: 30px; line-height: 30px; }

	* html #network { height: 30px; }	

	#networkleft { float: left; background: url(left.bmp) !important; width: 115px; height: 30px; }	
	#networkcenter { float: left; background: url(center.bmp); width: 500px; height: 30px; }	
	#networkright { float: right; background: url(right.bmp) !important; width: 15px; height: 30px; }	

 

when i change networkcenter to width:100% it goes all wrong, how can I change the css code to make the middle image repeat as much as is avalible.

 

thanks

[Hybride]

The shorthand version is

background: url(center.bmp) repeat-y;

where "repeat-y" repeats the image vertically; there's also an option to "repeat-x" which repeats the image horizontally; and "repeat" which repeats both horizontally and vertically.

 

Btw, I should mention I just assumed you meant repeat vertically. Just switch "repeat-y" to "repeat" if you wanted it repeated it continually both ways.

[Axeia]

Also note BMP is the worst possible choice you can make for an image, they're huge and I doubt they work well crossbrowser.

In general, animation = gif, photo's = jpeg, other = png