2 replies to this topic

[Indigo]

My problem is kind of hard to explain, but I'll try:

My layout looks somewhat like this (navigation on left and right, content in the middle):
| //// | //////////// | //// |
| //// | //////////// | //// |
| //// | //////////// | //// |
| //// | //////////// | //// |

My code here is this:

 
<div id="wrapper">
<div id="left">Navigation</div>
<div id="content">Content</div>
<div id="rigth">Navigation</div>
</div>

Now, what I need to do is that when the content-div is longer than the navigation, the wrapper-div should expand in heigth, not just the content-div. How do I do this?

Btw, here's my CSS:

#wrapper {
	position: relative;
	width: 770px;
	margin:0 auto;
	background-color: #3ba;
}

#left{
	position: absolute;
	top: 360px;
	left: 10px;
	width: 140px;
	height: 200px;
	padding: 8px;
}

#content {
	position: absolute;
	top: 360px;
	left: 150px;
	width: 460px;
	height: 200px;
	padding: 8px;
}

#rigth {
	position: absolute;
	top: 360px;
	left: 610px;
	width: 140px;
	height: 200px;
	padding: 8px;
}

[coolaid]

its impossible since you're using absolute positioning.

you could use relative positioning like for example:

<div id="wrapper">
<div id="left">Navigation</div>
<div id="content">Content</div>
<div id="rigth">Navigation</div>
<div style="clear:both;" />
</div>

and the css would be like:

#left{
	float:left;
	width: 140px;
	height: 200px;
	padding: 8px;
}

#content {
	float:left;
	width: 460px;
	height: 200px;
	padding: 8px;
}

#rigth {
	float:left;
	width: 140px;
	height: 200px;
	padding: 8px;
}

[Indigo]

Thanks A LOT, this really helped me. The problem is solved now, thanks to you.