外层元素（如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. log4j:ERROR LogMananger.repositorySelector was null likely due to error in class reloading, using NOPLoggerRepository.

    The reason for the error is a new listener in Tomcat 6.0.24. You can fix this error by adding this l ...

  2. 常见的mongo shell命令

    启动mongo shell 在windows下,双击mongo.exe可以启动mongo shell 查询库.表及选择库 查询所有库命令: show dbs 应用某一个db use jxs_datab ...

  3. 简易的JQuery设置Cookie

    使用之前先引用这两个文件: 然后基本的功能代码如下: <div> <input id="txtDelValues" type="text" / ...

  4. ELF学习--可执行文件

    承接上一篇.我们来看看可执行文件和重定位文件的不同点. readelf -h test 相比较重定位文件,可执行文件的ELF header中入口地址是0x8048320.而且除了section hea ...

  5. WPF中的DependencyProperty存储方式详解

    前言 接触WPF有一段时间了,之前虽然也经常使用,但是对于DependencyProperty一直处于一知半解的状态.今天花了整整一下午将这个概念梳理了一下,自觉对这个概念有了较为清晰的认识,之前很多 ...

  6. Web服务器(CassiniDev的裁减版)

    做此程序的原因是将软件部署简化,省去IIS的麻烦部署,减少项目实施人员的工作量和工作复杂度 Server sv = , "/", @"D:\web", IPAd ...

  7. Java数据类型简单认识

    Java是一种强类型编程语言,因而在声明变量的时候必须声明数据类型,java语言有基本数据类型和引用数据类型这两大数据类型,基本数据类型有8种分别是4种整型.2种浮点类型.1种用于Unicode表示字 ...

  8. Ehcache（04）——设置缓存的大小

    http://haohaoxuexi.iteye.com/blog/2116749 设置缓存的大小 目录 1     CacheManager级别 2     Cache级别 3     大小衡量 4 ...

  9. 终于可以发布Delphi下收点OSGI精髓皮毛而设计的插件框架WisdomPluginFramework

    这是一个Delphi实现的插件框架,我耗费了相当相当相当多的精力来设计她,虽然仅闪着点我微薄智慧的光芒,但我还是决定用Wisdom来命名她,也因它是我绝无仅有的,在完成1年多后回头来看仍能相当满意的作 ...

  10. KVO机制

    KVO,全称为Key-Value Observing,是iOS中的一种设计模式,用来监测对象的某些属性的实时变化情况并作出响应 首先,假设我们的目标是在一个UITableViewController内 ...