填充和边距右0，铬显示否则

Question

我在主包装div中有一个内容div。我已经在内容div上将margin-right和paddding-right设置为0，但chrome仍显示它延伸到包装器div的末尾，甚至传递了一点：

我试图理解为什么会这样。外部和内部div的Css看起来像这样：

#Inner {
    position: relative;
    width: 40%;
    height: 70%;
    top: 3%;
    margin-left: 2%;
    margin-right: 0;
    padding-right: 0;
    text-align: center;
}
#outer {

    height:80vh;
    width:50vw;
    position:absolute;
    border-radius:5%;
    border:3px solid black;
    left:50%;
    transform:translate(-50%, 0);
    top:10%;
    background: linear-gradient(to bottom, #304352, #525252);
}

这只是与chrome有关，还是内部div到目前为止真的延伸了，甚至传递了包装器？

Answer 1

经过一番研究后，我发现添加display inline-block属性似乎带走了正确的边距。我想我还有更多了解块模型。