子元素浮动对父元素的影响(高度塌陷)

出现原因:

父元素没有设置宽度和高度,完全是由子元素内容撑起来的,一旦子元素浮动也就是脱离文档流。浏览器渲染时,就好像父元素里面没有内容了。所以就会出现高度塌陷问题。

解决方案

  1. .给父元素设置height
  2. 给父元素设置 overflow:auto/hidden
  3. 设置父元素 浮动 float:left/right
  4. 在所有子元素后面加一个空的table 标签 然后为其设置 clear:both

你可能感兴趣的:(css,浮动,高度塌陷,浮动对父元素的影响)