左对齐框不会保留在父 div 中

Question

我有我想向左漂浮的盒子，因此它们会并排对齐。但是我有问题。如果我设置了float: left;，我会得到：左对齐

他们跳出父级(灰色div(。如果我设置了float: none;，我会得到这个：float：无

盒子留在Div中，并与他们一起伸展，但它们在另一个下方，我不喜欢。我将如何在div内部实现左对齐的盒子？
盒子的CSS：

.parent {
  float: left;
  width: 200px;
  background-color: white;
  border: 1px solid rgb(230,230,230);
  margin: 10px;
}

Answer 1

您必须使用溢出CSS规则。在灰色框中添加以下CSS属性：

overflow:hidden;

应用此属性后，您将在灰色框中获取物品，而它们不会落在其外部。

Answer 2

您需要将 <div style="clear:both"></div>放在最后的父级内。

<div class="parent">
    your code
    <div style="clear:both;"></div>
</div>

Answer 3

每当您使用float时，都需要通过将clear: both分配给其父