em width - why not px ?

Em width as I understand = the width of an em (m) in a particular font at a particular font height. There is also an en width (half an em).

It seems to me, then, that an em varies in its px width depending on the font chosen and the font height. eg em width varies between arial, times etc and also varies with a font size of 12px and 60px.
It is not the often quoted 16px

All dimensions I meet in website layout are in pixels - so why not use pixels for width in the CSS Menu action.

Nick


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Sometime around 11/10/08 (at 03:55 -0400) NicolasAllan said:

why not use pixels for width in the CSS Menu action.

I wish I knew. :slight_smile:
Actually, I really just wish I had the option!

I’ve designed things so it isn’t a problem, but it does feel less
controllable than other things. Okay, perhaps if I designed
everything in Ems… but I don’t.

k


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hello Keith,
A like mind !!
Thanks.
Nick


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi Guys,

The reason was so that the menu items grow proportionally with the
text when the text size is increased. If the widths are pixel based
then they will remain fixed at the same size all the time while the
text continues to grow.

I’ll log a suggestion for adding the ability to choose between
measurements as long as it doesn’t over complicate the current
implementation.

Best wishes,

Joe Billings
Support Technician
Softpress Systems Ltd


On 11 Oct 2008, at 12:15, NicolasAllan wrote:

Hello Keith,
A like mind !!
Thanks.
Nick


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Defining one object on the page in ems and another in pixels is asking for trouble. There’s a simple rule: be consistent in your choice of units. I’d like to use ems for a whole site, but this is rather complicated in Freeway, since if you define a div to have a width of 6 ems, Freeway thinks that this is equivalent to 6 pixels.

It would certainly be good if you add the ability to choose between units for CSS menus. It would also be good if you made things defined in ems display correctly in the whole of Freeway.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Joe, thanks for logging that suggestion …can you do it big bold red letters.

Cheers - Marcel


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ems are a great unit to use when specifying the size of divs. It is a source of great frustration to me that ems are not more widely supported in Freeway - in particular, it should be easy to specify divs and tables in ems.

The reason for this is that when the dimensions of a container, eg a div, are specified in pixels, and if the container is tightly filled in Freeway with text of a given font size, it will only look the same in a browser if the user viewing the page has their base font size set the same as yours. This is not always the case; some systems and some users prefer larger default font sizes in pixels, and others set a smaller default font in their browser. For these users, either the text overflows the div, or it fails to fill it correctly - either way, it won’t look right.

On the other hand, if the div size is specified in ems, and all font size declarations in the document are ‘relative’ to a base font size that is (ideally, but not essentially) defined for the page container div, then should the user increase their browser’s default font size, then all enclosed containers will proportionally increase in size as well, keeping everything in ‘normal’ appearance - by this I mean that if the text gets bigger by say 20%, then the enclosing divs (all of them) will also expand by the same amount.

People on this list have said, “Yes, but how many users change their default font size?” The answer is that many systems come with preset default font sizes different from yours or mine, depending on pixel density. Default browser fonts can be anything from 11 or 12 pt to say 14pt or even 16pt, and this can have a huge impact on how your page will look if the menus and divs are dimensioned in pixels.

Just quickly draw a few divs on screen, some inside others with dimensions in pixels, then fill them with text and give them a background colour, and then see what happens when you make the font bigger or smaller in the browser. Not nice. If ems could be used to specify all these div sizes, there would be no such problem.

Freeway really needs to move ahead a bit. There should be a page or site wide ‘units’ preference so that the default behaviour is either:

(a) pixels for dimensioning (with font size specifications in points) or alternatively

(b) ems or % for dimensioning with font sizes in relative terms (eg +1, or +120% etc).

The former is the current way Freeway works, but this does not make good layouts all the time.

The latter is ideal for liquid layouts that look good no matter how much font zoom is applied.

It is possible in Freeway to set dimensions for some objects in ems, however Freeway has a bug in that it draws each em as if it was one pixel wide, when it should be typically 10 or 12 or so, depending on base font, so it really looks silly. You can use extended attributes as an alternative. Neither approach is WYSIWYG.

It is incorrect to say that one should not mix units in a page. There is nothing bad or wrong about specifying the dimensions of some objects on a page in %, others in pixels, and others in ems. Modern browsers know what to do with them and all have their uses.

There is, however, a lot of problems and limitations in Freeway when it comes to using anything other than pixels.

Softpress have realised that an em based approach is required for the CSS menus to look good regardless of browser zoom. It’s time this was better implemented more generally in the application.

If Softpress were to allow pixel specifications as an alternative to ems for the CSS menus, unless you want your menus to totally stuff up on a number of platforms, you should take care to ensure that the pixel dimensions are generous rather than tight or else your menus won’t look good once the font size increases in some browsers.

If on the other hand Softpress allowed all things including base div sizes to be set properly in ems, then the whole page would look great, with all menus in proper proportion to the whole page, regardless of text zoom.

There are problems with all dimensioning strategies - ems and px and % - but in Freeway there is no option, you’ve got to do it the way Softpress decide - ems for menus and pixels for divs. People who don’t really understand this stuff find it very confusing, but if the defaults were as I suggested above it would all just work and most people would quickly find that the em approach worked better.

c


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Chris,
Thank you for such a clear and instructive explanation.
You have convinced me.
Many thanks from…
Nicolas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

At 03:55 -0400 11/10/08, NicolasAllan wrote:

Em width as I understand = the width of an em (m) in a particular
font at a particular font height. There is also an en width (half an
em).

From my programmer at Linotype days I remember an en being the width
of the digit ‘0’.

David - catching up after a holiday.


David Ledger - Freelance Unix Sysadmin in the UK.
HP-UX specialist of hpUG technical user group (www.hpug.org.uk)
email@hidden
www.ivdcs.co.uk


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I found a nice Mac OS X widget that will give you many different types of page measurement conversions, including pixels to ems.

It is called Designers Toolbox by Michael Preidel - not sure where exactly I got it but a Google search should turn it up.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Whether in DTP or the Web, and em is simply a width equal to the height of the type it’s found within, not a fixed unit of measure. So if you have a DIV that is styled to use 16px type with the font-size style property, then an em within that DIV will be equal to 16px. If you have not changed anything about your page, the base font-size in modern browsers is 16px, so an em is equal to 16px. But this is not a foregone conclusion, since the end-user may adjust this value in the browser preferences, and your page styles and local styling may also come into play.

Walter


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options