转自http://www.du52.com/text.php?id=362

当设计网页时,如果内部div全部设置css属性float为左右浮动,那么外部div将不能包裹内部div

解决方法

1.在内部div最后面加入一个不浮动元素,强制外部div包裹内部div

<div class="out">

<div class="inner">a</div><div class="inner">a</div>

<div style="clear:both;"></div><!-- 加入不浮动元素 -->

</div>





2.设置外部div的css属性overflow:hidden;zoom:1;这里需要注意,zoom是IE6专有属性设置zoom是为了兼容IE6

外部div不能包裹内部div的问题的更多相关文章

  1. 关于自适应屏幕,设置子元素浮动,父div不能包裹子div,子元素中内容溢出的问题。

    设置HTML适应不同分辨率的屏幕. 需求结构如下: HTML结构代码如下(只是其中一条): <body> <div class="content">< ...

  2. 外部盒模型大小固定 内部有边框div设置浮动时 缩放窗口内部div溢出的解决办法

    原因分析: chorme和firefox浏览器下当缩放窗口大小时,边框的计算宽度变大造成内部div宽度的计算宽度变大,外部div放不下内部div而溢出. 解决办法: 给内部div设置 box-sizi ...

  3. 在div中设置文字与内部div垂直居中

    要实现如图一所示的结果: html代码如下: <!DOCTYPE html> <html> <head lang="zh"> <meta ...

  4. 一个大div里面包裹一个小div,里面的小div的点击事件不触发外面的这个大div的点击事件

    一开始上html代码 <div id="div1" style="background: blue;width: 100px; height: 100px;&quo ...

  5. 内部div自动扩张剩余宽度

    <div id="container"> <div id="left">左边</div> <div id=" ...

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

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

  7. 父类div高度适应子类div

    父类div高度适应子类div 通常有许多div的高度由子类的高度决定父类的高度,所以需要父类div要适应子类div的高度,一般情况父类的高度可以直接设置成“auto”即可. 在有的情况下,子类div会 ...

  8. div内嵌p,div等块元素出现的问题

    div内嵌p,div等块元素出现的问题 http://caiceclb.iteye.com/blog/428085 div内部块级元素,比如p,div,设置外间距(margin)的话会怎样.本来还纳闷 ...

  9. jquery 实践操作:div 动态嵌套(追加) div

    此片记录在指定 div 中动态添加 div html(): append(): 在被选元素的结尾(但仍在元素内部)插入指定的内容. 语法: $(selector).append(content); / ...

随机推荐

  1. BZOJ5289 & 洛谷4437:[HNOI/AHOI2018]排列——题解

    https://www.lydsy.com/JudgeOnline/problem.php?id=5289 https://www.luogu.org/problemnew/show/P4437 考虑 ...

  2. react设置默认state和默认props

    1.默认状态设置 1.constructor (ES6) constructor(props) { this.state = { n: ... } } 2.getInitialState (ES5) ...

  3. POI 10.28

    [POI2015]KUR 不考虑构造原串再匹配 考虑开始位置满足什么条件才能匹配. 显然,开始位置确定,后面的字符都确定了. 而且,a,n互质,所以必然能遍历n的剩余系,从不同位置开始,初始的a*s+ ...

  4. Divide by Zero 2017 and Codeforces Round #399 (Div. 1 + Div. 2, combined) A B 水 搜索

    A. Oath of the Night's Watch time limit per test 2 seconds memory limit per test 256 megabytes input ...

  5. HDU 4771 (DFS+BFS)

    Problem Description Harry Potter has some precious. For example, his invisible robe, his wand and hi ...

  6. Transformation 线段树好题 好题 (独立写出来对线段树不容易)

    Transformation Time Limit: 15000/8000 MS (Java/Others)    Memory Limit: 65535/65536 K (Java/Others)T ...

  7. [vim]大小写转换

    http://babybandf.blog.163.com/blog/static/619935320110121134826/ ~ 将光标下的字母改变大小写 3~ 将光标位置开始的3个字母改变其大小 ...

  8. 【Android】完善Android学习(一:API 2.3.3)

    备注:之前Android入门学习的书籍使用的是杨丰盛的<Android应用开发揭秘>,这本书是基于Android 2.2API的,目前Android已经到4.4了,更新了很多的API,也增 ...

  9. vijos 1180 选课 树形DP

    描述 学校实行学分制.每门的必修课都有固定的学分,同时还必须获得相应的选修课程学分.学校开设了N(N<300)门的选修课程,每个学生可选课程的数量M是给定的.学生选修了这M门课并考核通过就能获得 ...

  10. Codeforces 671B/Round #352(div.2) D.Robin Hood 二分

    D. Robin Hood We all know the impressive story of Robin Hood. Robin Hood uses his archery skills and ...