外层元素（如div）中只有一个非空子元素，此时margin是被折叠了。两者之间取最大的margin值，表现在外层父元素上，而不是内层子元素。

　　注意：

　　（1）只有垂直方向上才会出现此现象，水平方向不会出现该现象；

　　（2）解决方法：

　　1）给内层子元素添加浮动；

　　2）在外层父元素内加 padding-top；

　　3）在外层父元素加 overflow:hidden；

CSS 之 内层div填充margin,外层div的背景色不会覆盖该margin的更多相关文章

  1. css让内层div自动撑开外层div

    .clear{clear:both;height:0px;font-size: 1px;line-height: 0px;} <div class="audi_items"& ...

  2. div高度自适外层div高度随里层div高度自适

    尝试过许多办法 其中一网友的最靠谱就是在外层div样式添加两个标签(不能少) clear:both;  overflow:auto;

  3. div嵌套引起的内层margin-top对外层div起作用

    嵌套div中margin-top转移问题的解决办法在这两个浏览器中,有两个嵌套关系的div,如果外层div的父元素padding值为0,那么内层div的margin-top或者margin-botto ...

  4. css hover 动画 transition:background-color 0.2s,color 0.2s; 外层套内层，正常是 里外层 鼠标上来 外层有hover，如果就想到里层hover触发外层hover，要用外层position 定义绝对定位，内层的hover跳出外层的div，这样视觉上就是两个单独的div，进行内外层联动。

    css hover 动画 transition:background-color 0.2s,color 0.2s; 外层套内层,正常是 里外层 鼠标上来 外层有hover,如果就想到里层hover触发 ...

  5. [CSS][转载]内层div的margin-top影响外层div

    参考 内层div的margin-top影响外层div——引出外边距合并 div嵌套导致子区域margin-top失效不起作用的解决方法 我使用的是在外层的div中添加 border: 1px soli ...

  6. 让内层Div将外层Div撑开

    在CSS排版中,如果一个层中的层使用了float浮动的话,那么就有可能会出现外层没有被内层撑开的情况,如以下代码所示: <div style="width:300px; "& ...

  7. 内层div的margin-top影响外层div——引出外边距合并Collapsing margins

    内层div的margin-top影响外层div——引出外边距合并Collapsing margins 作者:zccst 今天才算是了解边距合并.正如一位前辈所言,每一个CSS的坑,都让你学到不少知识. ...

  8. IE浏览器中overflow:hidden无效，内层元素超出外层div的解决方法

    原文地址:http://www.xin126.cn/show.asp?id=2624 在用css布局的时候,用IE浏览器(ie6.ie7.ie8)预览,有时候会出现内层元素(内部DIV.图片等)超出外 ...

  9. jsp学习---css基础知识学习,float,position,padding,div,margin

    1.常用页面布局 效果图: 代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...

随机推荐

  1. 使用sem_post信号量进行线程同步

    写了一小段程序,测试一下线程同步的问题,如下: #include <stdio.h> #include <string.h> #include <semaphore.h& ...

  2. js实现异步循环

    @(编程) 问题 实现异步循环时,你可能会遇到问题. 让我们试着写一个异步方法,每秒打印一次循环的索引值. for(var i = 0; i < 5; i++) { setTimeout(fun ...

  3. POJ 2378 Tree Cutting （DFS）

    题目链接:http://poj.org/problem?id=2378 一棵树,去掉一个点剩下的每棵子树节点数不超过n/2.问有哪些这样的点,并按照顺序输出. dfs回溯即可. //#pragma c ...

  4. defaultAutoCommit

    driver default The default auto-commit state of connections created by this pool. If not set then th ...

  5. 结构类模式（六）：享元（Flyweight）

    定义 运用共享技术有效的支持大量细粒度的对象. 两个状态 内蕴状态存储在享元内部,不会随环境的改变而有所不同,是可以共享的. 外蕴状态是不可以共享的,它随环境的改变而改变的,因此外蕴状态是由客户端来保 ...

  6. c# abstract抽象类与继承类子类的构造函数_base

    http://blog.itpub.net/9240380/viewspace-718054/ http://blog.163.com/cloud_thegreat/blog/static/10367 ...

  7. OSG+MFC对话框程序

    OSG的sample里面有OSG+MFC+MDI的例子. 网上有说OSG+MFCSDI的例子,如http://blog.csdn.net/xuguangsoft/article/details/816 ...

  8. JavaScript寻踪OOP之路

    上一集中,重点介绍了谁动了你的代码.这里先总结一下:咱们的代码从敲下来到运行出结果,经历了两个阶段:分析期与运行期.在分析期,JavaScript分析器悄悄动了我们的代码:在运行期,JavaScrip ...

  9. js ajax上传图片到服务器

    $("#up_goods_pic").on('change',function(){ var file = this.files[0]; var url = webkitURL.c ...

  10. Failed to issue method call: Unit mysqld.service failed to load: No such file or directory.

    国内私募机构九鼎控股打造APP,来就送 20元现金领取地址:http://jdb.jiudingcapital.com/phone.html内部邀请码:C8E245J (不写邀请码,没有现金送)国内私 ...