Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/77.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 左对齐的框不';I don’我不能呆在家长部_Html_Css - Fatal编程技术网

Html 左对齐的框不';I don’我不能呆在家长部

Html 左对齐的框不';I don’我不能呆在家长部,html,css,Html,Css,我有一些我想向左浮动的盒子,所以它们会并排排列。但我有个问题。如果我设置浮动:左我得到这个: 它们跳出父div(灰色div)。如果我设置float:none我得到这个: 盒子留在div里,div和它们一起伸展,但它们是一个接一个的,我不喜欢。如何在div中实现左对齐框? 框的CSS: .parent { float: left; width: 200px; background-color: white; border: 1px solid rgb(230,230,230);

我有一些我想向左浮动的盒子,所以它们会并排排列。但我有个问题。如果我设置<代码>浮动:左我得到这个:

它们跳出父div(灰色div)。如果我设置
float:none我得到这个:

盒子留在div里,div和它们一起伸展,但它们是一个接一个的,我不喜欢。如何在div中实现左对齐框?
框的CSS:

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

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

overflow:hidden;
应用此属性后,您将获得灰色框内的项目,并且这些项目不会落在灰色框外。

您需要在最后一个选项中将
指定给内部父div

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

你的代码

每当您使用float时,您需要通过将
清除:两个
分配给其父对象来清除它

您必须清除这些float,只需在父对象
div的末尾添加
就可以了