我已经开发了很多年的网站，经过多年的休整，我又回到了它，所以决定这是一个研究网格和响应式设计的理想时间。在过去的几天里，我一直在阅读和试验CSS网格及其背后的理论。我甚至开始在SCSS中开发自己的每个断点具有可变的％边距（因此移动设备不会被压扁的水槽）。
到目前为止，我所学到的东西让我对网格的看法颇为混乱。固定网格看起来反应灵敏，流体网格可能会出现舍入错误，而那些看起来并不太复杂的网格。我在理论上喜欢网格，但在实践中他们并没有完全说服我。
然而，我只是come across a method创建一个流畅的CSS网格，通过使用填充和边框来设置排水沟而不是边距，这似乎近乎完美。排水沟保持成比例，舍入误差最小化，并且设计可能更灵活。到目前为止我唯一能看到的缺点是老IE需要修复（那时没什么不寻常的。）
但是这种方法似乎并没有被广泛采用，这是（正确或错误地）让我对它保持警惕。除了上面链接的文章，我遇到的每篇文章和流体网格系统都使用边距而不是填充填充（而only one of those解决了舍入错误的问题。）
那么为什么这种方法如此多产？使用填充/边框而不是留水槽的余量是什么？
答案 0 :(得分：1)
您所问的基本上是人们为什么不使用box-sizing: border-box，对吧？
我只能猜测。可能是因为他们想要支持旧版本的IE，因为他们所有的旧模块都是在默认的盒子模型content-box下编写的，并且不能被重写它，或者可能是因为简单的无知。在较大的CSS网格的情况下，可能是吸引更大的，不知情的观众。
无论哪种方式，缺点都是无关紧要的。您更改框模型以从border或padding中减去width和height值，而不是添加到width或height。这意味着使用默认框模型编写的border-box和height可能需要重写，以免考虑元素可能具有的任何填充或边框。这就是全部，真的。
Browser support goes back to IE8，甚至还有a polyfill for IE6 and IE7，所以无需担心。
我注意到使用auto的一个怪癖是，当您将边框或填充应用于非方形图像时，除非您将border-box设置为{{1 }}。但是在这个RWD时代，谁不这样做呢？
给它几年，每个人都会使用content-box而不是{{1}}。