Home » Programming / Coding

Browser Independent min-height min-width

3 December 2008 1,186 views No Comment

The min-height property sets the minimum height of an element.

But problem is min-height does not work with IE! But it does with other browsers. So your css with min-height would not be browser independent, unless you take care of it.

Workaround:
_height property does work on IE as min-height. So we will add both solutions on css.

/* for min-height */
.selectorH {
background-color:red; /* for test only */
min-height:500px; /* for browsers other then IE */
_height: auto !important; /* for IE */
height:500px; /* so that IE would have at least this height */
}
/* for min-width */
.selectorW {
background-color:red;
min-width:500px;
_width: auto !important;
width:500px;
}

Or this will work as well:
/* for min-height */
.selectorH {
background-color:red; /* for test only */
min-height:500px; /* for browsers other then IE */
_height:500px; /* so that IE would have at least this height */
}
/* for min-width */
.selectorW {
background-color:red;
min-width:500px;
_width:500px;
}

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading ... Loading ...

Leave your response!

Add your comment below, or trackback from your own site. You can also subscribe to these comments via RSS.

Be nice. Keep it clean. Stay on topic. No spam.

You can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

This is a Gravatar-enabled weblog. To get your own globally-recognized-avatar, please register at Gravatar.