...

View Full Version : Flexible non image background



tiptoe
08-01-2012, 11:30 AM
Hi, I had a vision of a background that would be stretching and shrinking according to the size of the window. The background wouldn't be represented by image or photo, but by colored stripes created by HTML/CSS code. Using CSS I couldn't figure it out, and eventually I managed it somehow using tables and CSS, but it doesn't work in older versions of IE. Is there anybody who would know, how to do this better?

Example:
http://www.jiristary.cz/test

Basically it is just about how to create three vertical DIVs side by side. All with 100% height, the middle with a fixed width and centered on the middle and the other two on the sides, which would exactly fill the remaining width to 100%.

TylerB
08-01-2012, 06:15 PM
I don't know what you have your divs named, but here is an un-tested example:

leftStripes {
float: left;
height: 100%;
display: inline;
}

middleContent {
height: 100%;
display: inline;
}

rightStripes {
height: 100%;
display: inline;
float: right;
}

that should create three vertical <divs> side by side. You just have to implement your stripes css in there and adjust your widths to whatever you want.

Using a background image would be much easier though, you could create it in Photoshop then just save a 1px wide by 100% tall image and repeat it on the X-axis.

Like I said, I don't know if this will work 100% for sure as it is untested, but from my experience that looks like something that would work for me.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum