-
Notifications
You must be signed in to change notification settings - Fork 673
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[mediaqueries] Account for minimum font size in relative length media queries #5858
Comments
I agree with you. As long as browsers are not implementing the minimum font-size via some property (applied in the UA stylesheet), then there shouldn't be any technical reason why doing what you suggest should be unfeasible. |
Minimum font-size does not affect em/rem lengths in computed values on elements. Blink aligned with Firefox for M79 fixing 308862. The reason for fixing it was that a minimum font-size would break a lot of real-world layouts. We discovered that when there was a bug which accidentally wrote a minimum font-size of 6px from the settings UI and we got many reports about it. The typical failing sites would set the font-size on the html element to a size lower than the minimum font-size expecting rem units for other elements to not be affected by the minimum font-size. So, I don't think the statement about relative units in the first comment is accurate. At least not for Chrome or Firefox. The width and height of this box is 100px regardless of minimum font-size:
|
With typical browser defaults, this box would be 100px wide.
|
The CSS Working Group just discussed
The full IRC log of that discussion<dael> Topic: [mediaqueries] Account for minimum font size in relative length media queries<dael> github: https://github.com//issues/5858 <dael> florian: You can use font based units in MQ. Is viewport at least 12em. If you changed default font size in browser this is the size that will be taken into account. If you do it using your own CSS it's ignored. <dael> florian: However, undefined if it takes min font size. If you make min > default should MQ calc on default or min? Having MQ being inconsistent with layout makes them unreliable. But it's tricky <TabAtkins> q+ <dael> florian: As rune pointed out in issue we're kind of doing weird things with them. The em and rem length units are not effected by min font size. If you increase font is bigger but things measured is not. <smfr> q- <astearns> ack smfr <dael> florian: Appears we have to lie in one way or another. If people do MQ in font units to measure text taking min size seems good. But if trying to check against something measured in font units it wouldn't be. <dael> florian: I don't know what would be better, but good to define. <dael> florian: I think all browsers do not take min into account. We had somebody complaining b/c that wasn't convenient <dael> TabAtkins: The use cases rune talked about are things like people setting root font size to 10px so they can use em as a big pixel unit. That is a little different then doing this with root font size <dael> TabAtkins: I don't think the reasoning for lying in normal ems applies here. Might be good to do for consistency, but use case if different enough that telling truth about text size can be worthwhile here <dael> fantasai: I agree with TabAtkins. Use cases for font relative units is about how much text can I fit, can I do 2 col of content. That's largely based on size of text. em here should reflect font size <dael> florian: Happy with that. Is anyone not or is rune on? <dael> rune: I'm fine with that. Reason why I pointed out is the original reporter said something about consistency and this wouldn't be. There is no consistency argument. I don't have objections against resolving to take min font size into account <dael> florian: Sounds like consensus <tantek> regrets+ <dael> astearns: Prop: MQ will take the larger of font size or min font size <dael> TabAtkins: Have the MQ resolve their em against the actual default size which includes minimum. <dael> astearns: Objections to TabAtkins wording? <dael> RESOLVED: Have the MQ resolve their em against the actual default size which includes minimum. |
I like that wording! Thanks all! |
When a browser has a minimum font-size that is larger than the default font-size, the initial font-size used in media queries is relative to the smaller value. For a site that has been coded to scale with relative lengths, this can cause many layout issues as breakpoints no longer align with what has effectively become relative size of the content. Relative units in declarations are affected by minimum font-size, but media queries are not affected.
In the context of this following statement, I think the initial value of the font size should be defined as the greater of the user-specified sizes—either default or minimum font-size.
"Relative length units in media queries are based on the initial value, which means that units are never based on results of declarations."
https://www.w3.org/TR/mediaqueries-5/#units
The text was updated successfully, but these errors were encountered: