Formula for configuring EM for width mathematically

[Girard Ibanez]

Is there a simple logic when using ems for the width when making a navigational css menu?

If I wanted 8 main menu catagories, can the width be computed mathematically?

My problem happens at the sub level width of the menu.

[jscheuer1]

Well, em's for dimensions are tied to the font-size in effect of the element being styled. With a default font and font-size, you can generally divide the desired pixel dimension by 16 to arrive at the em dimension. If your font and/or especially font-size is different, you need to use a different divisor but, this usually can be fairly quickly arrived at via trial and error.

Incidentally, if you are going to set dimensions by em's and are not using the default font size, it is best to set the font-size style as a percentage. All sorts of inconsistencies can arise in IE if you use anything else. In fact, for best design results in general, font-size should always be set as a percent or not at all.

[Twey]

Yes:

xem = 1em × x

The exact size of 1em is dictated by the user's font settings.

[jscheuer1]

Yes:

xem = 1em × x

The exact size of 1em is dictated by the user's font settings.

That's unhelpful from a design perspective. If you set things so that they work with the font size you have, as outlined in my previous post in this thread, you generally will arrive at a design that can adapt to the viewer's font-size. That's the whole point.

However, the keyword is generally. There are many novice design practices that could result in a mess when the user changes font-size. The best way to tell is to experiment with the design, viewing it in the browser with different font-sizes to see the result.

Incidentally this method of designing, using em's for dimensions is becoming less important with many browsers using a more or less true zoom in favor of text size changes. Due to a number of factors however, for the foreseeable future, em dimensions will continue to be a key accessibility feature of a well thought out design.

[Twey]

Not so. It will no longer be important due to explicit text resizing, but default font sizes still vary, even if the user doesn't specifically adapt them for the page.

ems are also a good measure of what a user considers acceptable: 1em will always be a readable font size.

[jscheuer1]

Not so.

Huh? What's not so? The fact that em designing is becoming less important or the fact that for the foreseeable future it still will be important? Something else?

[mburt]

Back to the original post... the user wants to know how to use em's for the width of his/her menu. I suppose he/she wants to automatically calculate the width of the menu depending on the font size of the page.

[Twey]

The fact that em designing is becoming less important or the fact that for the foreseeable future it still will be important?

The former, sorry for being vague.

[jscheuer1]

I'm sorry, it simply is less important. It still is important but, with most users now with the available ability to scale a page rather than its fonts, it is clearly less important, if only slightly. This trend will most likely continue though so that, at some point, it will no longer be much of a consideration at all.

[Twey]

The only time at which it will cease to be a serious consideration is when all users have exactly the same font size, which I must say is quite an unlikely event.