Web Hosting Talk







View Full Version : Can't wrap a DIV around 2 floating div


grabmail
05-19-2006, 11:30 PM
<div bgcolor:blue>
<div float:left width:30%></div>
<div float:left width:70%></div>
</div>


ignore the incorrect html syntax.

basically, i have 2 floating divs. mimicing 2 columns in a row.

So just like how you would highlight a row by <tr bgcolor:blue>

i want to highlight the floating divs too.

<div bgcolor:blue> DOES NOT WRAP around the 2 floating divs. Instead, it lies ABOVE the 2 divs.

What is the right way to wrap the 2 floating div so i can highlight them?

JBelthoff
05-20-2006, 01:40 PM
First you need to give your div's an id or a class. Seeing as you have three that you want to uniquely style you would want an id.


<div id="outter">
<div id"innerleft></div>
<div id="innerright"></div>
</div>


Than you can syle it in a external style sheet like this.


#outter {background-color: #f00;} /* Red */
#innerleft {background-color: #0f0;} /* Green */
#innerright {background-color: #00f;} /* BLue */


Once you float an element you take it out of the document structure. So you would have to give your floated div's a height style and then you would need to clear those floats to make them behave.



:peace: