当使用百分比(%)来调整元素大小时,Chrome显然更喜欢用数学方法编写自己的规则.
据我所知,当你加80 + 20时,你得到100; 对？好的.Chrome也了解这一点.但是,如果我们以不同的方式写出相同的等 例如:(78 + 1 + 1)+(18 + 1 + 1)你得到了什么？是100吗？我也是.
所以后来有人可以请告诉我为什么铬不以为然？
取两个元素并将它们并排放在一起.然后,应用于width:20%一个元素和width:80%剩余元素.您会注意到100%的页面(或容器)已被两个元素并排占用.但是,让我们保持简单,并在每个元素的两侧添加仅1%的填充.这意味着一个元素将具有width:18%; padding:1%,而另一个元素将具有width:78%; padding:1%.理论上,这应该仍然具有相同的结果:100%的页面(或容器)被两个元素并排占用.但在Chrome中,情况并非如此.它不足.
证据是在布丁中:jsfiddle(如果你使用的是Chrome,你会发现细微的差别).
这是令人沮丧的,因为当它全部加起来时,特别是并排使用更多的元素,它可以真正抛出一个布局.我知道通过创建子元素来处理填充和/或边距,我们可以避免这种情况,但这可能导致使用标记,否则这将是多余的.
我只需要解释为什么Chrome会以这种方式运行(也许它完全是一个Webkit的东西,我还没有测试过它).