A blog & community for non-professional web designers, programmers, webmasters, and other web savvies.

CSS Minimum Height

June 25, 2010 - 12:00am -- aashni

I needed this code on my site, as I'm floating a lot of my divs, and if the content div is too short, then the navigation area get's messed up.

This code is useful if you have pages with content shorter than your navigation bar, and you don't want your sidebar to be affected by it. It creates a minimum height that the div must be, and if your content exceeds this limit, then it will expand the page accordingly.

<style type="text/css">

.divName{
min-height:50px;
}

</style>
<div class="divName" style="border:1px solid black;width:100px">text in a div</div>
<br>
<div class="divName" style="border:1px solid black;width:100px">text in a div that stretches it outside the minimum height and beyond and even more than that</div>
Code Preview: 
text in a div

text in a div that stretches it outside the minimum height and beyond and even more than that
Tags: 

@IceCaves on Twitter

    Stay Connected

    Twitter Facebook Tumblr Google+ Glaciallis Google RSS

    *Follow us on Twitter or Facebook to also follow minor site updates that don't make it to the homepage news.