problem with putting divs inside a div

liunx

Guest
I want to put some divs inside a div (container). I can not specify any height for the containter since I want it to set based on the height of the divs inside it. as long as there is nothing beneath it or the height of last div is greater than other no problems show itself but otherwise it looks as if the containter has the height of zero and the dive beneath the containter behaves odd.
example:
<DIV STYLE='background-color:red;'>
<DIV STYLE='background-color:gray;float:left;'>
<br><BR><BR><BR>hdy<BR>
</DIV>
<DIV STYLE='background-color:yellow;'>
Some Text for test.
</DIV>
</DIV>

<DIV ID='3' STYLE='background-color:blue;'>
TEXT For the forth div
</DIV>

I dare to explain what I want using a table although being exposed to the danger of being lectured about the difference of phylasophy of divs and tables :)
what i need should look like the result of these two tables:

<TABLE>
<TR>
<TD>
some text, some text
</TD>
</TR>
<TR>
<TD>

</TD>
</TR>
</TABLE>

<TABLE>
<TR>
<TD>
</TD>
</TR>
</TABLE>

Hope there is a solution.

Thanks.You need to clear the float. (<!-- m --><a class="postlink" href="http://bonrouge.com/br.php?page=floats">http://bonrouge.com/br.php?page=floats</a><!-- m -->)You need to clear the float. (<!-- m --><a class="postlink" href="http://bonrouge.com/br.php?page=floats">http://bonrouge.com/br.php?page=floats</a><!-- m -->)

If I clear float they will be beneath each other. I want them to be next to each other to produce something like the table that I have given above.

As I said I need a container div to align it at the center of the screen then put two or three divs inside it each one of them work like a column and no a row. But the problem is that I dont' want to specify any hight for the container.Mybe you should think in columns rather that, as in HTML, in rows...Try this:

<DIV ID='3' STYLE='background-color:blue;clear:both;'>
TEXT For the forth div
</DIV>Try this:

<DIV ID='3' STYLE='background-color:blue;clear:both;'>
TEXT For the forth div
</DIV>

worked just fine, thanksIf I clear float they will be beneath each other. I want them to be next to each other to produce something like the table that I have given above.

As I said I need a container div to align it at the center of the screen then put two or three divs inside it each one of them work like a column and no a row. But the problem is that I dont' want to specify any hight for the container.
Yeah... I meant to clear the float after the thing you have on the right. The solution you have there clears the float, but if you check it, you'll probably find that you won't see a red background. The container doesn't wrap itself around the floated div. If you want that red background to appear, I'd go back and read the page I directed you to.

By the way, it's not good practice to write html in upper-case.
 
Back
Top