SitePoint Sponsor |
|
User Tag List
Results 1 to 8 of 8
Thread: setting fonts with pixels
-
Jul 23, 2008, 11:59 #1
setting fonts with pixels
I was hoping someone could share some experience with setting font in pixels. Is it true IE does not support font resizing (with ctrl +/-)?
Also, if a layout doesn't "break" when resizing with em specified font sizes, would it also not break with pixel font sizes?
-
Jul 23, 2008, 13:27 #2
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
Hi,
IE7 and under don't allow the text to be resized from the browsers controls when the font is specified in pixels (although IE7 does have a zoom facility).
Most other browsers will allow the text to be resized whatever the unit.
A layout will break if an element has a fixed height and width in pixels and contains text content. If the text is resized then it grows bigger than the container and then overflows. If the element didn't have a height (e.g. it's height was dictated by content) then the layout would grow vertically with the resize although it would look different.
If you size the element in ems and the font in ems then the layout grows proportionately with the text resize and looks much the same but just bigger.
Here is a very old example showing the differences.
http://www.pmob.co.uk/temp/emdemo.htm
Sizing the font in pixels is bad for accessibility because there are still many IE6 users around and they need to be able to change their text size to suit.
-
Jul 23, 2008, 13:27 #3
- Join Date
- Jul 2003
- Location
- Springfield, MO
- Posts
- 1,867
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Yeah, IE doesn't support font resizing in pixels even though they're technically a relative unit of measurement. I tend to disagree, that any layout will eventually break with font sizes in em's, however, a properly designed site using em's won't break until a really huge font size.
/*EDIT -- dang it, Paul beat me. Paul's explanation is a bit better anyway and what I was attempting to get at*/
-
Jul 23, 2008, 13:36 #4
As the others said, IE6 is the real stumbling block when it comes to sizing text in pixels. The latest versions of IE, Firefox, and Opera all favor a page zoom over text resizing in their user interfaces. As more user agents move toward a full page zoom, we will need to re-evaluate how we size text on the web. However, I'm addressing only desktop browsers. I don't have experience resizing text/pages on mobile devices and other user agents.
-
Jul 23, 2008, 15:18 #5
If the latest browsers are moving towards page zoom.. what is page zoom's advantage over text resizing?
-
Jul 23, 2008, 16:00 #6what is page zoom's advantage over text resizing?
Say for example you have a 2 column site with fixed width navigation sidebar of 150px, if you have a long word and the text size is increased 2-3 times it will spill out.
With zoom it is magnifying the sidebar and the text, a quick test of a fixed width site of 775px in Opera with zoom of 120% at my resolution of 1152 x 864 keeps it intact but fills my whole screen. A step up to 150% creates a horizontal scroll bar for me.
The advantage I see is that the site will not break.Ray H.- css-lab.com
W3C Specs - CSS 2.1 | CSS current work | Properties Index
-
Jul 24, 2008, 00:27 #7
- Join Date
- Feb 2006
- Location
- Bedford, UK
- Posts
- 1,687
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
The difficulty with zooming is that it depends how well the browser does it.
Opera and Firefox zooms seem to work fairly well. IE7 however.... I haven't bothered checking recently to see if it's fixed but, for instance, it won't zoom background images on the body element - which breaks layouts immediately.
-
Jul 24, 2008, 01:04 #8it depends how well the browser does it
As you said though, the good browsers seem to work fairly well. I wasn't aware of IE7's body image issue, I can see how it would break a layout that was dependent on that image though.Ray H.- css-lab.com
W3C Specs - CSS 2.1 | CSS current work | Properties Index
Bookmarks