-
Notifications
You must be signed in to change notification settings - Fork 807
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
.grid-960 {width: 98rem}
not work for Chrome
#110
Comments
I also used chrome 58 also encountered this issue. |
我的解决方案是html font size设置为20px...然后全部除以2..... 不知道还有没有好的解决方式,mac上的chrome貌似padding:1rem = 10px(但是宽度还是按12px的基数来算),windows上1rem 都等于 12px |
@seekcx 因为 Chrome 默认语言设置为中文的最小字体大小是 12px,已知问题。两个方案,一个是你提到的设置大于 12px 的 root em 重新计算,另一个方案是全部输出为 px 宽度。 |
恩,我也找了很多资料,感觉还是调整大小算是比较好的解决方案,如果spectre能调整大小就更好了,让框架本身就能在各个浏览器保持一致。所以能否考虑一下不要用10px作为root em? |
@seekcx 我考虑是全部 px 单位输出,因为现在用到 rem 单位的特性还比较少,权衡下来可能这样更容易。 |
恩,这样也挺好的。 |
@gera2ld rem 在响应式和全局调整大小方面会有很省力的作用,但很遗憾,Spectre 目前没有用到太多。 |
@seekcx 或许可以把 html 的 |
我们的项目里通常是把html的font-size设成50px或者100px,这样转换的时候也很好计算,又能避免Chrome的这个问题。 现在已经切换成px了?那这个issue可以关了吗? |
@gera2ld 最新分支已经切换到 px,可能要纠结一下。 |
Since the root font-size is defined on
<html>
:And
.grid-960
is defined with a width of98rem
. So the expected width should be:However this does not work because Chrome has a smallest
font-size
limit of12px
. So the width is actually calculated like this:And the layout breaks.
A workaround is to define a larger root
font-size
on<html>
and recalculate therem
s.The text was updated successfully, but these errors were encountered: