如何使一个div的高度增长,同时里面有浮动的东西[英] How to make a div grow in height while having floats inside

本文是小编为大家收集整理的关于如何使一个div的高度增长,同时里面有浮动的东西的处理方法,想解了如何使一个div的高度增长,同时里面有浮动的东西的问题怎么解决?如何使一个div的高度增长,同时里面有浮动的东西问题的解决办法?那么可以参考本文帮助大家快速定位并解决问题。

问题描述

当div浮出水面时,我该如何使其高度增长?我知道,定义宽度的值并将溢出设置为隐藏作品.问题在于我需要一个div,可见溢出.有什么想法吗?

推荐答案

overflow:auto;在包含的div上使其内部的所有内容(甚至是漂浮物品)可见,外部div完全包裹着它们.请参阅此示例:

.wrap {
  padding: 1em;
  overflow: auto;
  background: silver;
 }
 
.float {
  float: left;
  width: 40%;
  background: white;
  margin: 0 1%;
}
<div class="wrap">
  <div class="float">Cras mattis iudicium purus sit amet fermentum. At nos hinc posthac, sitientis piros Afros. Qui ipsorum lingua Celtae, nostra Galli appellantur. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Ambitioni dedisse scripsisse iudicaretur.</div>
  <div class="float">Mercedem aut nummos unde unde extricat, amaras. A communi observantia non est recedendum. Quisque ut dolor gravida, placerat libero vel, euismod. Paullum deliquit, ponderibus modulisque suis ratio utitur.</div>
  </div>

其他推荐答案

有多种清除浮子的方法.您可以在这里检查一些:
a>

,例如,clear:both可能对您有用

#element:after {
    content:"";
    clear:both;
    display:block;
}

#element { zoom:1; }

其他推荐答案

在许多情况下,overflow: auto;就足够了,但是为了完成和交叉浏览器支持,请查看

以及以下样式.

.content { float:left; }

.clearfix { ..from link.. }

没有clearfix,父母div由于浮动的孩子而不会有高度. clearfix将使父母考虑浮动的孩子.

本文地址:https://www.itbaoku.cn/post/565381.html