CSS Float left, dropping div down
Posted: Sat Jan 07, 2006 1:06 pm
OK, may not be the best subject line; but I tried
I'm trying to create two collumns using CSS. Each collumn needs to be 40% of the page. However, when the page is resized the right collumn drops below the left collumn. How do I prevent the right collumn from dropping down? I've tried min-width but that didn't work
Note: This works fine in FF not the same in IE
http://hawleyjr.com/test/divtest.htm
I'm trying to create two collumns using CSS. Each collumn needs to be 40% of the page. However, when the page is resized the right collumn drops below the left collumn. How do I prevent the right collumn from dropping down? I've tried min-width but that didn't work
Note: This works fine in FF not the same in IE
http://hawleyjr.com/test/divtest.htm
Code: Select all
<style>
.div_holder{
width: 100%;
min-width:600px;
}
.left_coll_holder{
width: 40%;
height: 100%;
float:left;
border: 1px solid green;
padding: 10px;
margin: 10px;
}
.right_coll_holder{
width: 40%;
height: 100%;
float:left;
border: 1px solid red;
padding: 10px;
margin: 10px;
}
</style>
<div class="div_holder">
<div class="left_coll_holder"> </div>
<div class="right_coll_holder"> </div>
</div>