文章:子div撑不开父div的几种解决办法:

1,可以在所有子元素后增加<div style="clear:both;"></div>

2,给父容器增加样式:

.clearfix:after {

content: ".";

display: block;

height: 0;

clear: both;

visibility: hidden;

}

兼容IE样式:

/* Hides from IE-mac \*/

* html .clearfix {height: 1%;}

/* End hide from IE-mac */

3,父容器增加样式:overflow:hidden

感觉第三种方法最为简单。

html布局-子div浮动后,父容器撑不开解决的更多相关文章

  1. 【html】【8】div布局[子div在父div居底]

    从今天起 开始细话div布局   思路及要点: 父div的位置设置成相对的,即“position: relative;”. 而子div的位置设置成绝对的,并且下边缘设为0,即“position: ab ...

  2. 子级用css float浮动 而父级不能自适应高度解决方法

    解决子级对象使用css float浮动 而父级div不能自适应高度,不能被父级内容撑开解决方法,父级div没有高度解决方法. 当在对象内的盒子使用了float后,导致对象本身不能被撑开自适应高度,这个 ...

  3. 解决 css 浮动后 父元素高度失效问题

    应用场景 子元素标签使用 浮动后,会出现浮在父元素上层,脱离了.导致父元素没办法根据子元素的高度而变化,提供以下解决方案. 解决代码 把 '.clearfix ' Class 样式添加到 父元素即可. ...

  4. Position a child div relative to parent container in CSS: [设置 子DIV位置 跟 父DIV相关联]

    最近调DIV的位置比较头疼,各种position: relative / absolute google到一篇好文章[http://www.webdevdoor.com/html-css/css-po ...

  5. css 父div如何包裹带有float属性的子div,float子div如何撑开父div

    来自网络摘抄 原始代码 <style> #div1{border:1px solid red;float:left;} #div2,#div3{float:right;border:1px ...

  6. 解决子元素用css float浮动后父级元素高度自适应高度

    1.在最后一个子元素后面清除浮动 2.父元素加over-flow:hidden;(副作用:子元素定位不能超出父元素的范围) 3.父元素也一样浮动(最笨的方法): 4.子元素使用inline-block ...

  7. css 解决父div与子div不在同一容器的问题

    <html> <head> </head> <body> <div style="margin:0 auto;width:600px;b ...

  8. div clear清除浮动产生的影响 被受影响的div加上清除浮动后 不会填充前一个div浮动后空出的位置

  9. html同行两个div浮动后下一个div怎么换行的问题

    传送门:https://blog.csdn.net/asdfg6541/article/details/78514535

随机推荐

  1. .py .pyc .pyd .pyw文件区别

  2. cpu多级缓存

    CPU cache: CPU的频率太快,主存跟不上,在处理器时钟周期内,CPU需要等待主存,浪费资源.cpu cache的出现,缓解了cpu与主存之间速度不匹配的问题. CPU cache的特性: 1 ...

  3. jsp 记录

      前后端开发好久后,一直没怎么用前端开发了.最近任务比较急,又开始写jsp页面了... 1)jquery.validate.min.js 用法总结 https://www.cnblogs.com/x ...

  4. [LeetCode] 844. Backspace String Compare 退格字符串比较

    Given two strings S and T, return if they are equal when both are typed into empty text editors. # m ...

  5. Java分布式定时任务

    分布式定时任务 elastic-job 可以实现任务分片 quartz 可以把任务存入数据库,实时生成任务(添加数据库添加定时任务) 文档 中文翻译 翻译2

  6. mysql查询列为空

    SELECT * FROM `表名` WHERE ISNULL(列名)

  7. [转帖]helm模板文件chart编写语法详解

    helm模板文件chart编写语法详解 https://blog.51cto.com/qujunorz/2421328 需要学习一下. charts编写介绍 开始 快速创建一个chart模板,helm ...

  8. C++ 读取一个文件下所有文件的文件名

    Windows: #include<iostream> #include<string> #include <io.h> void readFileNameInDi ...

  9. libevent实现对管道的读写操作

    读管道: #include <stdio.h> #include <unistd.h> #include <stdlib.h> #include <sys/t ...

  10. shiro源码解析

    一.web.xml 文件中配置的 DelegatingFilterProxy 的 <filter-name>为啥与Spring文件中配置的ShiroFilterFactoryBean的Be ...