Re: [css-d] font-size in body selector?
Felix Miata wrote: Keep in mind that the browser default size is akin to having zoomed in advance to the preferred or optimum personalized base text size. I find in practice that it is not. For this reason I have had to reduce my default font size from 20px to 16px and use per-site zoom-memory instead. Sites that work fine with real zoom often break with default font size 16px. Philip Taylor __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
Le 19 avr. 2013 à 17:10, Philip TAYLOR p.tay...@rhul.ac.uk a écrit : Sites that work fine with real zoom often break with default font size 16px. ‘Real’ zoom: is that ‘Page zoom’ or ‘Text zoom’ ? (afaik your preferred browser still has the 2 options) Sites are less likely to break with the former, as it enlarges everything. With Text zoom, things can easily go bonkers when the site relies on “px” for sizing boxes (width, or worse, height). Fwiw, I quite often see broken sites (even high profile ones) with my minimum font-size set to 14px. Philippe -- Philippe Wittenbergh http://l-c-n.com __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
On 2013-04-19 09:10 (GMT+0100) Philip TAYLOR composed: Felix Miata wrote: Keep in mind that the browser default size is akin to having zoomed in advance to the preferred or optimum personalized base text size. I find in practice that it is not. For this reason I have had to reduce my default font size from 20px to 16px and use per-site zoom-memory instead. Sites that work fine with real zoom often break with default font size 16px. Zoom memory is yet another evolution of defending against disrespect, with its own set of drawbacks, not the least of which is what happens on sites that style differently for different content types or sections or query results. Break is what happens on sites that don't design for the web or users, but instead for themselves, using px to define arbitrary container sizes instead of em or rem to make proportions hold across a wide range of default size settings. With the relatively nominal difference between 16 and 20 maybe you find it acceptable to have a sub-optimal setting for un-styled text and previously unvisited sites. You think the same would be similarly appropriate for someone who prefers or requires a 24px default? 28px? 32px? More? -- The wise are known for their understanding, and pleasant words are persuasive. Proverbs 16:21 (New Living Translation) Team OS/2 ** Reg. Linux User #211409 ** a11y rocks! Felix Miata *** http://fm.no-ip.com/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
On 2013-04-19 17:25 (GMT+0900) Philippe Wittenbergh composed: Philip TAYLOR composed: Sites that work fine with real zoom often break with default font size 16px. ‘Real’ zoom: is that ‘Page zoom’ or ‘Text zoom’ ? (afaik your preferred browser still has the 2 options) Sites are less likely to break with the former, as it enlarges everything. With Text zoom, things can easily go bonkers when the site relies on “px” for sizing boxes (width, or worse, height). Fwiw, I quite often see broken sites (even high profile ones) with my minimum font-size set to 14px. Imagine the problem for those with a 20px or more minimum. :-( -- The wise are known for their understanding, and pleasant words are persuasive. Proverbs 16:21 (New Living Translation) Team OS/2 ** Reg. Linux User #211409 ** a11y rocks! Felix Miata *** http://fm.no-ip.com/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
On 04/18/2013 12:06 PM, Micky Hulse wrote: From what I know, that's based on the browser and the user prefs. On my Mac, using Firefox latest, there's a Fonts Colors section of in the prefs under Content. The default font size out-of-the-box is Times 16. Anecdote: I have an older friend, in his 60s, that has this set to something like 14px. When I viewed my site on his computer all of the font sizes were terribly small. It ended up that he had tweaked his default font size in Safari. He said he preferred the size and was not open to changing it back to 16. I thought it was odd, because he uses reading glasses to surf the net. I have a friend who used to run very high resolutions on a very nice 17 CRT monitor. I could barely read the icon label text on his screen. He had no problems - he used reading glasses with it. Then, at the other end of the scale, Larry Niven or Jerry Pournelle (I forget which one was doing this) used a 17 monitor at EGA resolution (640x350?) so the text was big enough for him to read ... Now just imagine a visitor coming to your site using his or her Google Nexus 10 running at 2560x1600 resolution on a 10 diagonal display ... 16px is going to be VERY TINY! -- David gn...@hawaii.rr.com authenticity, honesty, community http://clanjones.org/david/ http://dancing-treefrog.deviantart.com/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
Le 19 avr. 2013 à 18:28, david gn...@hawaii.rr.com a écrit : Now just imagine a visitor coming to your site using his or her Google Nexus 10 running at 2560x1600 resolution on a 10 diagonal display … 16px is going to be VERY TINY! No, not really. That device has a HiDPI screen. The 2560x1600 quoted are _device_ pixels. But the CSS pixel ratio is 2 [*] - 2 device pixels per CSS pixel. The ‘16px’ here is a CSS px, not a device px; in device pixels, the font-size would be something like 32px. It is the same thing as the Retina iPad, iPhone, iPod or the Retina MBP’s. [*] handy list: http://en.wikipedia.org/wiki/List_of_displays_by_pixel_density Philippe -- Philippe Wittenbergh http://l-c-n.com __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
On 04/18/2013 11:56 PM, Philippe Wittenbergh wrote: Le 19 avr. 2013 à 18:28, david gn...@hawaii.rr.com a écrit : Now just imagine a visitor coming to your site using his or her Google Nexus 10 running at 2560x1600 resolution on a 10 diagonal display … 16px is going to be VERY TINY! No, not really. That device has a HiDPI screen. The 2560x1600 quoted are _device_ pixels. But the CSS pixel ratio is 2 [*] - 2 device pixels per CSS pixel. The ‘16px’ here is a CSS px, not a device px; in device pixels, the font-size would be something like 32px. It is the same thing as the Retina iPad, iPhone, iPod or the Retina MBP’s. [*] handy list: http://en.wikipedia.org/wiki/List_of_displays_by_pixel_density Ah, thanks, useful reference. Still sounds small to me. I hope to replace my PDA with a Nexus 10 whenever the PDA finally dies - so I'll get to experience it myself. Still, 32px (device) on a 10 diagonal screen sounds like it would be too small. -- David gn...@hawaii.rr.com authenticity, honesty, community http://clanjones.org/david/ http://dancing-treefrog.deviantart.com/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
On 2013-04-19 00:29 (GMT-1000) david composed: Philippe Wittenbergh wrote: david composed: Now just imagine a visitor coming to your site using his or her Google Nexus 10 running at 2560x1600 resolution on a 10 diagonal display … 16px is going to be VERY TINY! No, not really. That device has a HiDPI screen. The 2560x1600 quoted are _device_ pixels. But the CSS pixel ratio is 2 [*] - 2 device pixels per CSS pixel. The ‘16px’ here is a CSS px, not a device px; in device pixels, the font-size would be something like 32px. It is the same thing as the Retina iPad, iPhone, iPod or the Retina MBP’s. [*] handy list: http://en.wikipedia.org/wiki/List_of_displays_by_pixel_density Ah, thanks, useful reference. Still sounds small to me. I hope to replace my PDA with a Nexus 10 whenever the PDA finally dies - so I'll get to experience it myself. Still, 32px (device) on a 10 diagonal screen sounds like it would be too small. dev32px on a 300 DPI screen is about 5.76pt physical. With the 2:1 CSSpx:devicepx ratio that Wikipedia page reports, I would expect so. 96 * 3 = 288, so I should expect a 3:1 ratio be used, and CSS16px to display dev48px, and CSS16px to display physically @8.6pt, which is 222% of the physical[1] size of 5.76pt (8.6^2 / 5.76^2). Regardless, sizing text in px disregards user preferences/defaults, and thus rude. Applied to anything but bitmaps or containers with no content other than bitmaps, px values greater than a single digit should be unsupported, and the 1:1 ratio between px pt dispensed with, in CSS4 if it ever gets past recommendation. [1] physical size is a function of area (height width). 32px at twice the (nominal) CSS size of 16px is four times its physical size. -- The wise are known for their understanding, and pleasant words are persuasive. Proverbs 16:21 (New Living Translation) Team OS/2 ** Reg. Linux User #211409 ** a11y rocks! Felix Miata *** http://fm.no-ip.com/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] font-size in body selector?
My understanding of font-size spec is: 100% = 1 em = the size of an M and that this is 16px high. What I am not clear is: where do you tell the browser how large the M is? Is it universally understood that 1 M is 16 pixels high? thank you! John __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
You can spec font-size of 100% on the body. This respects the users preference settings in their browser. You can then spec element font size in ems. The 16px is usually the default size set in browsers upon install. — Sent from Mailbox for iPhone On Thu, Apr 18, 2013 at 5:54 PM, COM j...@coffeeonmars.com wrote: My understanding of font-size spec is: 100% = 1 em = the size of an M and that this is 16px high. What I am not clear is: where do you tell the browser how large the M is? Is it universally understood that 1 M is 16 pixels high? thank you! John __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
From what I know, that's based on the browser and the user prefs. On my Mac, using Firefox latest, there's a Fonts Colors section of in the prefs under Content. The default font size out-of-the-box is Times 16. Anecdote: I have an older friend, in his 60s, that has this set to something like 14px. When I viewed my site on his computer all of the font sizes were terribly small. It ended up that he had tweaked his default font size in Safari. He said he preferred the size and was not open to changing it back to 16. I thought it was odd, because he uses reading glasses to surf the net. The moral of the story is that they end user has the final say when using relative font sizing techniques like setting the font-size to 100% on the html/body elements. Of course, for the gurus out there, please correct me if anything I said (technically) is wrong. :D Cheers, Micky __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
2013-04-19 0:54, COM wrote: My understanding of font-size spec is: 100% = 1 em = the size of an M and that this is 16px high. No, in the value of the font-size property, the em unit denotes the font size of the parent element. The font size is the height of the font. It is easy to see that the common misconception about its relationship to the width or height of M is completely wrong e.g. by creating an element with width and height set to 1em and placing the letter M there. The font size is whatever it has been set to. Its initial value, as per browser defaults, might be 16px. Or something else. What I am not clear is: where do you tell the browser how large the M is? You don't. The font designer decides the dimensions of letters, relative to the font size. Is it universally understood that 1 M is 16 pixels high? No. Yucca __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
On Thu, 18 Apr 2013, COM wrote: My understanding of font-size spec is: 100% = 1 em = the size of an M and that this is 16px high. 100% is the user's default font size. It could be anything from 12px to 24 px (or larger or smaller) and should be used for any body text on the page. What I am not clear is: where do you tell the browser how large the M is? Is it universally understood that 1 M is 16 pixels high? 1em is the current font-size. -- Chris F.A. Johnson, http://cfajohnson.com/ Author: Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress) Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress) __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
On Apr 18, 2013, at 3:07 PM, Jukka K. Korpela jkorp...@cs.tut.fi wrote: What I am not clear is: where do you tell the browser how large the M is? You don't. The font designer decides the dimensions of letters, relative to the font size. OK…so the 1em is just a starting point and you adjust to suit..or these are all *relative* sizes because in the child elements you might spec font-size: .85em ? ..so that if User cranks up the sizes, everything sizes up (or down) in the same relationship? J __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
You might find this tool interesting to play with: http://pxtoem.com/ The Learn tab has some OK info, and the math (for conversions) is good to know too. This article might also be of some interest to you: http://snook.ca/archives/html_and_css/font-size-with-rem __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] font-size in body selector?
On 2013-04-18 15:12 (GMT-0700) COM composed:
OK…so the 1em is just a starting point and you adjust to suit..or these are all
*relative* sizes because in the child elements you might spec font-size: .85em ?
..so that if User cranks up the sizes, everything sizes up (or down) in the
same relationship?
Essentially true.
Keep in mind that the browser default size is akin to having zoomed in
advance to the preferred or optimum personalized base text size. Zoom via
keyboard or mouse is a defense mechanism provided to browser users for the
purpose of combating designers' disrespectful (aka, rude or offensive)
styling methods, either sizing without regard to user defaults (by sizing in
px, pt, in, cm, etc.), or against them (declaring some fraction on body
and/or paragraph text, such as 70%, .8em or CSS small), both of which leave
most page text smaller (usually) than the user's preference or optimum.
Using CSS, and where necessary scripting, designers can set all the page
pieces in place to cause the visual results they desire via various
combinations of keyword, %, em, ex rem, all in conjunction with the
browser's default @100%. If anything in their work is wrong sized using
100%/1em/1rem as the (body {}) foundation, they've neglected the very
important personalization of their own work environment so that unstyled text
is optimally sized for them. Object relationship perspectives should be the
closest thing to size they concern themselves with. They shouldn't and
needn't impose their ideas of what's an optimum absolute size in their own
environments on everyone using their work. That needlessly puts them on the
offensive and most of the world on the defensive.
You as designer choose the objects, and via em/rem/%/keyword, the
perspectives among them (e.g. bigger for headings or emphasis, smaller for
captions or footers or fine print). The user specifies the size of the (rem)
unit to implement those perspectives. Nobody needs defenses. Everybody's
happy, and by default, not by time wasting and responsive/defensive twiddling
after a page loads.
--
The wise are known for their understanding, and pleasant
words are persuasive. Proverbs 16:21 (New Living Translation)
Team OS/2 ** Reg. Linux User #211409 ** a11y rocks!
Felix Miata *** http://fm.no-ip.com/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
