380378 - Convert from em to ch widths

Status: NEW

(SeaMonkey :: UI Design, defect)

Description

[[e-mail]]

Historically the only font-relative width unit we've had available has been the em. This suffers from the problem that it's only a height unit and therefore is inadequate for representing the width of an object. This means that the amount of width available for text depends on the aspect ratio of the font, which varies between fonts and also depends on the weight of the font. This means that dialogs have generally been sized for the Arial Normal font and anyone using other fonts (particularly the Mac, which defaults to bold fonts) loses out.

For an example, a width: 13em; in Arial 11px works out at 143px. I suggest this be changed to 18ch which works out at 144px. If you were using a wider font, this might change to (say) 176px, which would otherwise have necessitated an ugly hack to give the Mac a width of 16em to achieve the same result.

Comment 1

[[e-mail]]

Some mxr hits:

/suite/profile/migration/migration.xul,
>line 48 -- style="width: 40em; height: 30em;"

/suite/browser/pageInfo.xul,
>line 111 -- <column style="width: .5em;"/>
>line 202 -- <column style="width: .5em;"/>
>line 284 -- <column style="width: .5em;"/>

/suite/browser/turboDialog.xul,
>line 77 -- <vbox flex="1" style="max-width: 36em;"/>

/suite/common/pref/pref-languages-add.xul,
>line 49 -- style="width: 25em;height: 28em;">

/suite/common/pref/pref.xul,
>line 38 -- <tree id="prefsTree" style="width: 13em;" flex="1"/>

/suite/common/pref/pref-applications-edit.xul,
>line 46 -- style="width: 30em;"

/suite/common/pref/pref-charset.xul,
>line 52 -- style="width: 44em; height: 33em;">

/suite/common/pref/pref-advanced.xul,
>line 344 -- <tree id="jvmConfigListObj" style="width: 60em; height: 10em"

/suite/common/pref/pref-proxies-advanced.xul,
>line 50 -- style="width: 33em;"

/suite/common/permissions/cookieP3PDialog.xul,
>line 61 -- style="width: 45em;">

/suite/common/permissions/cookieViewer.xul,
>line 52 -- style="width: 30em;"

/suite/common/permissions/cookieP3P.xul,
>line 54 -- style="width: 45em;">

/suite/common/permissions/aboutPopups.xul,
>line 54 -- style="width: 30em;"

/suite/common/permissions/permissionsManager.xul,
>line 50 -- style="width:32em; height:42em;"

/suite/common/openLocation.xul,
>line 57 -- style="width: 40em;"

/suite/common/bookmarks/addBookmark.xul,
>line 127 -- <spacer style="width: 36em;"/>

/suite/common/bookmarks/sortFolder.xul,
>line 52 -- style="width: 30em;"

/suite/common/bookmarks/bm-props.xul,
>line 52 -- onload="Init()" style="width: 40em;"

/suite/common/bookmarks/findBookmark.xul,
>line 50 -- <dialog id="findBookmarkWindow" style="width: 36em;"

/suite/common/history/findHistory.xul,
>line 48 -- <dialog id="findHistoryWindow" style="width: 36em;"

/profile/resources/content/profileSelection.xul,
>line 59 -- style="width: 42em;"
>line 87 -- <description id="intro" style="width: 17em;"/>
>line 89 -- <description style="width: 17em;" class="label">&pmTextA.label;</description>

/profile/resources/content/selectLang.xul,
>line 12 -- style="width: 22em;"

/editor/ui/composer/content/pref-editing.xul,
>line 143 -- <textbox id="BackgroundImageInput" oninput="ChangeBackgroundImage();" style="min-width: 23em" flex="1" class="uri-element">

/editor/ui/dialogs/content/EdTableProps.xul,
>line 280 -- <description class="wrap" flex="1" style="width: 1em">&cellUseCheckboxHelp.label;</description>

/editor/ui/dialogs/content/EdInsertTOC.xul,
>line 70 -- <columns><column/><column style="min-width: 6em"/><column/></columns>

/editor/ui/dialogs/content/EdLinkProps.xul,
>line 64 -- <vbox style="min-width: 20em">

/editor/ui/dialogs/content/EditorPublishProgress.xul,
>line 89 -- <vbox align="center" style="max-width:30em">
>line 92 -- <description id="StatusMessage" class="wrap" style="max-width:30em; min-height: 1em"/>

/editor/ui/dialogs/content/EdAdvancedEdit.xul,
>line 51 -- style="width: 40em;"

/editor/ui/dialogs/content/EdColorPicker.xul,
>line 91 -- <textbox id="ColorInput" style="width: 8em" oninput="SetColorSwatch(); SetDefaultToOk();"/>

/editor/ui/dialogs/content/EditorPublish.xul,
>line 83 -- style="min-width:18em; max-width:18em;" crop="right"

/editor/ui/dialogs/content/EditorSaveAsCharset.xul,
>line 54 -- style="width: 32em;">
>line 68 -- <description id="TitleHelp" class="wrap" style="width:1em" />

/editor/ui/dialogs/content/EdInsSrc.xul,
>line 64 -- <vbox flex="1" style="width: 30em; height: 20em;">
>line 65 -- <textbox id="srcInput" multiline="true" rows="1" style="width: 1em" flex="1" class="uri-element"/>

/editor/ui/dialogs/content/EdDictionary.xul,
>line 55 -- <columns><column style="width: 15em" flex="1"/><column flex="1"/></columns>

/editor/ui/dialogs/content/EdConvertToTable.xul,
>line 52 -- style="min-width:20em">

Comment 2

[[e-mail]]

More mxr hits:

/suite/locales/en-US/chrome/common/pref/win/platformPrefOverlay.dtd,
>line 21 -- <!ENTITY prefWindow.size "width: 52em; height: 41em;">

/suite/locales/en-US/chrome/common/pref/unix/platformPrefOverlay.dtd,
>line 13 -- <!ENTITY prefWindow.size "width: 52em; height: 41em;">

/suite/locales/en-US/chrome/common/pref/mac/platformPrefOverlay.dtd,
>line 13 -- <!ENTITY prefWindow.size "width: 58em; height: 41em;">

/suite/locales/en-US/chrome/mailnews/pref/AccountManager.dtd,
>line 22 -- <!ENTITY accountManager.size "width: 55em; height: 50em;">
>line 23 -- <!ENTITY macAccountManager.size "width: 60em; height: 50em;">
>line 24 -- <!ENTITY accountTree.width "width: 17em;">

/suite/locales/en-US/chrome/mailnews/pref/AccountWizard.dtd,
>line 4 -- <!ENTITY accountWizard.size "width: 40em; height: 38em;">

/suite/locales/en-US/chrome/mailnews/fieldMapImport.dtd,
>line 39 -- <!ENTITY fieldMapImport.size "width: 40em; height: 30em;">

/profile/resources/locale/en-US/createProfileWizard.dtd,
>line 4 -- <!ENTITY window.size "width: 47em; height: 32em;">

Comment 3

[[e-mail]]

Some approximate conversions:
 8em	11ch
13em	18ch
32em	44ch
40em	55ch
45em	62ch

Comment 4

[Robert Kaiser]

I'll convert http://mxr.mozilla.org/seamonkey/source/security/manager/pki/resources/content/crlManager.xul#54 as we need a bigger width there anyways ;-)

Comment 5

[Serge Gautherie (:sgautherie)]

Filter "spam" on "guifeatures-nobody-20080610".