Cross Browser min-height, max-height

Standard

Yes, it even works in IE

For max-height, we go for this

For min-height, we go for this

To use both at the same time

The expression value only works for IE and will require javascript, so that’s fine to use. One caveat: Dont’ use it if you have a choice.

With a little jQuery this will be even easier. This will be the DOM, note that we specified the maxHeight and minHeight as attributes

In the JavaScript, for each of those div of class constraint, we will correct the width and height accordingly

If all else fails, we could always fall back to the traditional and all-powerful conditional stylesheet, note that conditional stylesheet will only affect IE users with width and height of constraint elements be set manually.

 

Leave a Reply