元素设置浮动以后，缩放窗口塌陷问题。

程序员文章站 2022-03-12 21:57:50

项目场景：浮动元素缩放，高度塌陷。问题描述：提示：这里描述项目中遇到的问题：例如：数据传输过程中数据不时出现丢失的情况，偶尔会丢失一部分数据APP 中接收数据代码：@Override public void run() { bytes = mmInStream.read(buffer); mHandler.obtainMessage(READ_DATA, bytes, -1, buffer).sendToTarget();...

项目场景：

浮动元素缩放，高度塌陷。

问题描述：

float

做项目时，元素已经设置了浮动，而且父元素也清除了浮动，但是会出现缩放时，会出现高度塌陷问题。如下图。

<style>

 li{
	float:left;
	width:110px;
	height:90px;
    margin:5px;
    list-style: none;
    background-color: aqua;
}
</style>
</head>

<body>
<h3>图片库</h3>
<p>试着调整窗口,看看当图片没有足够的空间会发生什么。</p>
<ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>
</body>

原因分析：

父元素没有设置宽度，会导致缩放失真，元素塌陷，一行排列不下，会换行排列给父元素设置最小宽度，或者宽度即可。

解决方案：

float-1

 ul{
        /* width: 600px; */或者min-width: 600px;

 }

本文地址：https://blog.csdn.net/weixin_50821119/article/details/111099641