博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
转载:margin外边距合并问题以及解决方式
阅读量:7123 次
发布时间:2019-06-28

本文共 457 字,大约阅读时间需要 1 分钟。

    
Title

一、在div里面有子元素div1时,div在没有设置overflow:hidden或者是border属性时,div的margin-top的值为div/div1中的margin-top的最大值。上面的结果如图:

 

注意:div1在div中的margin-top值为0px;

二、当父级div设置了上述属性中的一个时(如overflow:hidden/auto),结果如下图所示:

 div的margin-top值为其自身设置的值10px,同时div1的margin-top值也是正常的20px

三、当元素是兄弟元素时,在不设置float和position:absolute时margin-bottom和margin-top会自动的合并为两者中的最大值。如上面的div1和div2两者之间的margin距离为20px;当两者同时设置了float:Left时,两者之间的margin值是30px,如图所示:

          设置float前:                                                                                                      设置float后

                                                               

转载地址:http://hrxel.baihongyu.com/

你可能感兴趣的文章
Java面试:投行的15个多线程和并发面试题
查看>>
天天生鲜项目学习之-项目创建
查看>>
数据结构与算法--排序(JS实现)
查看>>
面试知识点突击
查看>>
MySQL-训练题实践
查看>>
Quart2D 画图一 (简单画线、形状)
查看>>
javaScript(三):原型链(共用属性)
查看>>
free VIRL lab
查看>>
JS笔试题中的类型转换
查看>>
java B2B2C springmvc mybatis仿淘宝电子商城系统
查看>>
好的文章整理
查看>>
2018-08-14 打造有态度的---区块链新社区
查看>>
高性能缓存服务器 nuster 1.7.9.8 发布
查看>>
监听浏览器后退事件
查看>>
【全开源】可视化DIY微信/百度/支付宝小程序saas平台源码
查看>>
视频课程-数组去重你知道多少种方法?-冰山工作室-沙翼-web前端
查看>>
elementUI分页在IE浏览器中存在的bug
查看>>
是哪一瞬间让后端们决定入职的?
查看>>
[实践总结]纯css实现动态边框
查看>>
字幕字体滚动插件——scroxt.js
查看>>