Question

在制作其父级width:100%然后对其应用padding-right:5%;时，就好像我在div上创建width:105%;一样，这会影响其他在width:70%; padding-right:2%; float:left

等情况下，在其旁边浮动的div

我们假设我们有这个代码

<div style="width:100%; padding-right:3%;"> text </div>

这将在页面上创建一个水平滚动条，因为div的宽度现在基本上超过了100％。我的问题是，如何正确调整div的大小？我是否必须从padding或其中减去实际div width？这就是我现在正在做的事情并且它正在发挥作用，但我觉得这不是最好的方法。

Answer 1

只需将box-sizing: border-box添加到元素的样式中：

＆＃13;

  <div style="width: 100%; padding-right: 3%; box-sizing: border-box;"> text </div>

＆＃13;

根据MDN：

<强>边界框

宽度和高度属性包括内容，填充和边框，但不包括边距。