Forum Moderators: not2easy

Message Too Old, No Replies

Relative sizing of DIV width with ex units: NS/IE difference

Why are they so different? It makes relative sizing unworkable!

         

MTKilpatrick

1:21 am on Jul 22, 2003 (gmt 0)

10+ Year Member



I was under the impression that the em and ex units are supposed to be relative to the font size of the parent element. If that is the case, how come that Netscape 6.2 and IE 6.0 display my navigation bar (an absolutely positioned left bar) in noticeably different widths with identical text sizes?

With my leftbar div set to width: 15ex, Netscape draws it as 36mm wide on my screen, whereas IE 6.0 draws it as 32mm wide. The amount of right padding in the Netscape version looks imbalanced. However, if I reduce the width the menu title "The Transcriptions" word wraps in IE, but not in NS!

Yuk! How do I get round this enormous discrepancy? I carefully avoid mixing margins, padding and widths because of the non-compliance issue: when using pixel measurements my website is identical in IE and NS.

If I use em units instead of ex units, the DIV does not change width in Netscape when I set the text to smaller or larger. When using ex the size of the DIV is scaled. A nasty Netscape bug?

So, really I think I'll go back to setting pt sizes and setting my menu bar to 120px wide. At least that works consistently!

thanks,

Michael

DrDoc

2:51 am on Jul 22, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I am going to be perfectly blunt and honest with you...

How do I get round this enormous discrepancy

Allow for a fluid layout.

really I think I'll go back to setting pt sizes

Pt is not a screen unit. Use it for a print style sheet, nothing else!

Nick_W

6:47 am on Jul 22, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I'll add to Doc's general sentiment:

CSS is a mindset that goes hand in hand with fluid, adjustable, accessible layout/design. Once you make the relatively easy move from thinking about precision and control to thinking about the user and suggestions to the UA, you, and your users will be happier ;)

I'm sorry we've not managed to give you an answer exact to your question, I hope our zealousness for fluid design is usefull though hehe!

Nick

MTKilpatrick

1:05 am on Jul 23, 2003 (gmt 0)

10+ Year Member



My answer has been to download Netscape 7. It correctly scales DIVs both in em and ex units. Netscape 6.2 is a bit broken. I have changed my site to fully scalable units - so anybody using N6.2 and trying to change the text size will have the left navigation bar fixed in absolute width. It doesn't stop it working, though.

Michael

DrDoc

1:18 am on Jul 23, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



It doesn't stop it working, though.

A very good attitude! Code according to standards. If it doesn't work 100% in a browser because of various bugs, fine, as long as it's usable :)