Stylesheets - ie css min-width max-width

Author

ie css min-width max-width

2005-10-14, 6:38 pm

Hello,

I've been trying to emulate css min-width and max-width in IE.

I've looked at various methods on the web, but none seemed to truly
emulate min-width / max-width, or at least not very elegantly.

There are two problems I've noticed:
1) padding / margin around containing element throw off calculations in
IE, even in strict mode. But there should be work arounds using an
extra containing element, so this isn't too bad I guess.

2) Using min-width / max-width with anything other than pixel based
values is problematic, unless there is some way to convert the units in
to pixels.

The code below finds the min-width and max-width in IE as they are in
the styleSheet using propriatery microsoft "currentStyle" property.
This does not give the value set with "style" property which is for
inline styles only, it is the true stylesheet value.

var e = document.getElementById( id );
var minWidth = e.currentStyle["min-width"];
var maxWidth = e.currentStyle["max-width"];

The pixel length of the item e, (the container we want to limit size
of) is:

var width = e.clientWidth;

With these values, we could then compare and limit the size of the
element in the script. It would be really nice if 'minWidth' and
'maxWidth' values could be converted into pixels. For example, if they
were specified in EM units. This is obviously calculated internally in
IE, is there some way to expose it in the script? Also, I only have
IE6 to test with, I'm assuming IE5 has the same methods.

Spartanicus

2005-10-14, 10:23 pm

"yb" <bajwa_yasir@yahoo.ca> wrote:

>I've been trying to emulate css min-width and max-width in IE.
>
>I've looked at various methods on the web, but none seemed to truly
>emulate min-width / max-width, or at least not very elegantly.

Are you aware of http://dean.edwards.name/IE7/ ?

--
Spartanicus