rem(font size of the root element)是指 相对于根元素的字体大小的单位。宽度用该单位其实是一种兼容行为了,和字体用会有点区别。
chrome的最小文字为大小12px;当文字小于12px时,会被当作12px进行计算。(火狐没有该限制,所以楼主在火狐下正常的)
比如你html的font-size:10px;
内容中,font-size:1.2rem是能正常显示为12px。但是width:2rem的话,它和字体的计算方式不一样,会变长2*12(因为html设置的10px小于12px)=24px了,比预计的20px多了4px。
解决办法就是把html的font-size设为大于12的值。
html,body{font-size: 40px !important;} 这样应该可以解决