如何阻止我的盒子伸展？

Question

如何阻止此盒子伸展？ 这是代码和结果：

CSS ：

.social {
    padding-left: 1000px;
    border: 5px inset black;
    margin: 4px;
    width: 100px;
}

HTML ：

<div class="social">
    <p>Social</p>
</div>

结果：

Answer 1

正如评论者指出的那样，你的1000px填充正在增加空间。这就是padding属性的作用 - 它添加了填充。

如果你想要＆＃39; social＆＃39;生活在100px左列（我猜你的样式），记住你需要浮动你的列，将它设置为内联块，或者用CSS表或flexbox来布局。