外层元素（如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. Android调用系统自带的文件管理器进行文件选择并读取

    先调用: intent = new Intent(Intent.ACTION_GET_CONTENT); intent.setType("*/*"); //设置类型,我这里是任意类 ...

  2. JAX-RS入门 一 ：基础

    简介 JAX-RS是一套用java实现REST服务的规范,提供了一些标注将一个资源类,一个POJOJava类,封装为Web资源.标注包括: @Path,标注资源类或方法的相对路径 @GET,@PUT, ...

  3. C++ 类的静态成员详细讲解[转]

    在C++中,静态成员是属于整个类的而不是某个对象,静态成员变量只存储一份供所有对象共用.所以在所有对象中都可以共享它.使用静态成员变量实现多个对象之间的数据共享不会破坏隐藏的原则,保证了安全性还可以节 ...

  4. Form时间交叉验证唯一性

    *==================================================   ** PROCEDURE:   check_effcitive_utl      Descr ...

  5. Pgpool烂泥扶不上墙

    写这篇文章,是想好心地给打算使用Pgpool的人提个醒: Pgpool 真的不适合在企业范围使用. 我的主要理由是: 设计陈旧: 一旦后台任何节点Down掉,都会引发failover,它会杀掉所有子进 ...

  6. PostgreSQL下，对汉字按拼音排序

    参考学习此文: http://blog.163.com/digoal@126/blog/static/163877040201173003547236/ 建库 postgres=# \l List o ...

  7. ZTE AD3812 3G模块在linux 2.6.34 内核的开发板上的支持方法

    先说段废话,话说在linux 2.6.34 下,好多比较新的3G网卡及3G模块都没有很好的支持.如果想支持的这些3G网卡/3G模块呢,基本上有两种方式: 1.使用该3G模块的 linux 下的驱动,交 ...

  8. 内网能PING通TELNET通不能访问解决

    遇到一个离奇故障,内网,两个主机在同一IP段内,能互相PING通,TELNET对方的WEB服务器端口,通. 但用IE访问时不能,显示HTTP400.这明显是客户端系统的问题啊!但如何解决呢?我强烈怀疑 ...

  9. [转载]GMT地形数据总结

    [转载]GMT地形数据总结     原文地址:GMT地形数据总结作者:Jason 转载:http://seisman.info/gmt-topo-grid-datas.html   目前接触到的地形数 ...

  10. (转)用AGG实现高质量图形输出(三)

    转自 :http://www.cnblogs.com/CoolJie/archive/2011/04/27/2030260.html 线段生成器(Span Generator) 我们前面举的例子使用的 ...