将填充添加到最小高度而不是包含它？答案

【问题标题】：Add padding to min-height instead of including it?将填充添加到最小高度而不是包含它？
【发布时间】：2016-03-24 19:25:44
【问题描述】：

有没有办法将元素上的填充添加到 min-height 值而不是包含在其中？例如，您在元素的顶部和底部有10px 的填充，最小高度为150px，高度应为170px，而不是元素的高度为130px + 20px 的填充。

我目前正在使用 Material Design Lite 构建一个网站，它为几乎所有内容添加了填充，因此当您想要设置最小高度值时，必须始终在某物上找到填充有点痛苦。

【问题讨论】：

听起来像是 box-sizing:content-box; 的工作，因为在默认的 content-box 模型中高度不应该包括填充。但这可能会破坏一些东西，所以一定要测试！
不幸的是，MDL 也使用box-sizing:border-box 来处理几乎所有事情，因此该方法不起作用:(
您是否尝试过删除填充而不是每次都尝试找到它？ This answer goes over how specificity can help you set padding to 0 for Material Design Lite.
嗯.... .不知道有没有其他不接触 DOM 的好方法。
@DanAfterFiveCoffees 我不想删除填充，因为它用于正确间隔材料设计元素，删除它只会产生不同的问题。

【解决方案1】：

我可能有点晚了，但是在元素上设置box-sizing: content-box; 可以解决问题。

【讨论】：