css - Bootstrap 问题 div 扩展到 span 之外

Question

我在另一个带有“span”类的 div 中有一个 div。子 div 的宽度设置为 100%。由于某种原因，div 在父 div 之外流动。

向父级添加“溢出:隐藏”只会切断子 div 的内容。

有人知道解决这个问题的方法吗？

下面的代码

.span8 {
float: none;
display: block;
width: 100%;
margin-left: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.child {
padding: 20px;
width: 100%;
}

<div class="span8 clearfix">
    <div class="child">
        My content    
    </div>
</div>

Answer 1

从您的子 CSS 类中删除 width: 100%。

block 元素自动呈现到其容器的整个宽度。此外，当您像您一样使用 padding 手动设置 width: 100% 时，它呈现为 100% + 40px。

.child {
    padding: 20px;
}

<div class="span8 clearfix">
    <div class="child">
        My content    
    </div>
</div>