Printable View
Can anyone tell me why my content wrapper is not expanding with content left and right columns? Heres my code...
I'm sure theres a simple answer to this!
#contentwrapper {
width: 750px;
background-image: url(/critic/images/contentbg1.gif);
background-repeat: repeat-y;
}
#contentleft {
float: left;
width: 590px;
background-color: #fff;
}
#content {
width: 580px;
margin: 5px;
color: #000;
}
#contentright {
float: right;
width: 160px;
background-color: #034FA3;
text-align: center;
}
I'm not positive what your trying to do.. but you have fixed pixel widths and you want a fluid layout?
I have a 2 col layout. The 2 cols have a wrapper. The wrapper has a bg image because a long article causes the left col to expand vertically and the right col stays at the fixed length. For some reason the wrapper is not expanding with the cols.
Its fixed centered layout, but needs to expand vertically.
You with me?
It's hard to tell exaclty without seeing the layout... for me at least, but have you tried position: absolute; for the contentwrapper?
If you're using 2 columns side-by-side and using floats, you should just float one of them and have a margin on the other.
It's hard to tell without looking at more of your code and how it's arranged, but try adding a block-level element (I'm tired, so if I'm wrong then just point it out) such as a paragraph tag, or div, etc. You'd simply use clear: both; on this element.
It may also be that you've accidently not closed the tags properly.
Ahh James I was waiting for you to come on :)
And you were right, I needed a clearer. I just added a <p> tag with a clearer and it's sorted...thanks.
No problem. It's the #1 problem people seem to have when dealing with floats.