文章:子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. (二)limit的高级用法

    一.取出前n条数据 ; 二.取出第几行到第几行的数据 ,; 解释:取出从第3行(从0行开始)开始的5条记录.

  2. [LeetCode] 110. Balanced Binary Tree 平衡二叉树

    Given a binary tree, determine if it is height-balanced. For this problem, a height-balanced binary ...

  3. 【视频开发】四大图像库:OpenCV/FreeImage/CImg/CxImage

    1.对OpenCV 的印象:功能十分的强大,而且支持目前先进的图像处理技术,体系十分完善,操作手册很详细,手册首先给大家补计算机视觉的知识,几乎涵盖了近10年内的主流算法: 然后将图像格式和矩阵运算, ...

  4. jinkins 部署过程

    jinkins 概述 jinkins 本身是一个 webapp 项目,部署在了tomcat 环境下,就变成了一个网站.他有一个功能,就是构建,构建的时候做了什么事情? gitlab 获取代码 mave ...

  5. [转帖]使用fastdfs搭建文件管理系统

    使用fastdfs搭建文件管理系统 https://www.jianshu.com/p/4e80069c84d3 今天同事说他们的系统用到了这个分布式文件管理系统. 一.FastDFS介绍 FastD ...

  6. Goroutines和线程对比

    目录 栈不同 调度不同 GOMAXPROCS Goroutine没有ID号 栈不同 线程:每一个OS线程都有一个固定大小的内存块(一般会是2MB)来做栈,这个栈会用来存储当前正在被调用或挂起(指在调用 ...

  7. flink ETL数据处理

    Flink ETL 实现数据清洗   一:需求(针对算法产生的日志数据进行清洗拆分) 1. 算法产生的日志数据是嵌套json格式,需要拆分 2.针对算法中的国家字段进行大区转换 3.最后把不同类型的日 ...

  8. Codeforces 1239B. The World Is Just a Programming Task (Hard Version)

    传送门 这一题好妙啊 首先把括号序列转化成平面直角坐标系 $xOy$ 上的折线,初始时折线从坐标系原点 $(0,0)$ 出发 如果第 $i$ 个位置是 '(' 那么折线就往上走一步($y+1$),否则 ...

  9. Ubuntu 18.04 Server 配置静态ip

    刚在虚拟机里面状态了一个 Ubunut 18.04 Server 作为我的服务器,我习惯使用静态ip首先再virtualbox中设置虚拟机网络的连接方式为桥接模式进入ubuntu虚拟机根据我的印象直接 ...

  10. redis客户端介绍及php客户端的下载安装

    一.PHP客户端1.官方提供了几款PHP客户端,包括amphp/redis.phpredis.Predis.Rediska.推荐使用官方推荐的两款客户端,phpredis.Predis2.phpred ...