CodingForums.com - View Single Post

Sammy12 · 07-19-2011, 05:52 AM

you have to clear your floats

whenever you float something, it needs either :

a) needs a height for the parent div (#main)

Code:

#main {
 height: 900px;
}

b) clear from the bottom

Code:

<div id="main">
 <div class="left"></div>
 <div class="right"></div>
 <div style="clear:both;"></div>
</div>

c) clearfix (clearing before)

Code:

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

Code:

<div id="main" class="clearfix">
 <div class="left"></div>
 <div class="right"></div>
</div>

now that you have a height set, you can use overflow: auto; on the #main

07-19-2011, 05:52 AM	PM User \| #2
Sammy12 Registered User Join Date: Jun 2011 Posts: 1,063 Thanks: 12 Thanked 241 Times in 240 Posts	you have to clear your floats whenever you float something, it needs either : a) needs a height for the parent div (#main) Code: #main { height: 900px; } b) clear from the bottom Code: <div id="main"> <div class="left"></div> <div class="right"></div> <div style="clear:both;"></div> </div> c) clearfix (clearing before) Code: .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } Code: <div id="main" class="clearfix"> <div class="left"></div> <div class="right"></div> </div> now that you have a height set, you can use overflow: auto; on the #main Last edited by Sammy12; 07-19-2011 at 06:01 AM..