产生的条件：子元素给了margin-top，并且父元素没有浮也没有其他样式，浏览器解析的结果是父元素下去了。

解决方法：1、给子元素或者父元素添加浮动，缺点：如果不需要浮动，添加浮动也页面布局会乱

2、给父元素添加一个边框border-top 边框最好是透明色，border-top：1px soild rgba（0,0,0,0）

margin-top的兼容问题的更多相关文章

  1. 左右margin top问题百分比值

    不想说今天心情有多差! 9点多開始发现一个"bug",需求是依据屏幕高度动态调整某个div的位置.代码大概是这种. <div style="margin-top: ...

  2. margin top 无效

    常出现两种情况: (一)margin-top失效 两个层box1和box2,box1具有浮动属性,box2没有,这时候设置box2的上边距margin-top没有效果. 解决办法: 1.box2增加f ...

  3. 理解css margin

    前提是对display:block元素 1 margin对没有width属性的元素,能影响其宽度,对于有width的则不起作用: 高度方面不受影响 此特性可用来排版 2 margin 与百分比 普通的 ...

  4. CSS中margin与padding的区别

    CSS边距属性定义元素周围的空间.通过使用单独的属性,可以对上.右.下.左的外边距进行设置.也可以使用简写的外边距属性同时改变所有的外边距.——W3School 边界(margin):元素周围生成额外 ...

  5. Margin and Padding in Windows Forms Controls

    https://msdn.microsoft.com/en-us/library/ms229627.aspx Margin and Padding Precise placement of contr ...

  6. 由浅入深漫谈margin属性1

    margin 在中文中我们翻译成外边距或者外补白(本文中引用外边距).他是元素盒模型(box model)的基础属性. (该文章解释是否正确有待商榷,目前我的实验结果为:在默认情况或者div左浮动的情 ...

  7. 不要告诉我你懂margin

    分类: Html/CSS | 转载请注明: 出自 海玉的博客 本文地址: http://www.hicss.net/do-not-tell-me-you-understand-margin/ 你真的了 ...

  8. margin四个元素的顺序

    如果margin给的是四个值比如:margin:0px 0px 0px 0px;代表:margin: top right bottom left代表从上右下左,顺时针方向.如果margin给的是三个值 ...

  9. CSS margin 属性

    设置外边距的最简单的方法就是使用 margin 属性. margin 属性接受任何长度单位,可以是像素.英寸.毫米或 em. margin 可以设置为 auto.更常见的做法是为外边距设置长度值.下面 ...

  10. Margin是什么？

    Margin是什么 CSS 边距属性定义元素周围的空间.通过使用单独的属性,可以对上.右.下.左的外边距进行设置.也可以使用简写的外边距属性同时改变所有的外边距.——W3School 边界,元素周围生 ...

随机推荐

  1. Koa与Node.js开发实战（1）——Koa安装搭建（视频演示）

    学习架构: 由于Koa2已经支持ES6及更高版本,包括支持async方法,所以请读者保证Node.js版本在7.6.0以上.如果需要在低于7.6的版本中应用Koa的async方法,建议使用Babel ...

  2. 一文说尽MySQL事务及ACID特性的实现原理

    MySQL 事务基础概念 事务(Transaction)是访问和更新数据库的程序执行单元:事务中可能包含一个或多个 sql 语句,这些语句要么都执行,要么都不执行.作为一个关系型数据库,MySQL 支 ...

  3. 自适应rem.js

    用rem.js来实现自适应屏幕大小,要注意border不用rem做单位  代码如下: (function (doc, win) { //orientationchange : 判断手机是水平方向还是垂 ...

  4. CSS3 Flex布局

    Flex 用于使页面上的内容自适应屏幕 首先,在网页代码的头部,加入一行viewport元标签. <meta name=”viewport” content=”width=device-widt ...

  5. [转] word2vec

    from: https://www.cnblogs.com/peghoty/p/3857839.html 另附一个比较好的介绍:https://zhuanlan.zhihu.com/p/2630679 ...

  6. FFT学习笔记

    快速傅里叶变换FFT(Fast Fourior Transform) 先说一下它能干嘛qwq ​ 傅里叶变换有两种,连续傅里叶变换和离散傅里叶变换,OI中主要用来快速计算多项式卷积. 等一下,卷积是啥 ...

  7. CV code references

    转:http://www.sigvc.org/bbs/thread-72-1-1.html 一.特征提取Feature Extraction:   SIFT [1] [Demo program][SI ...

  8. js 刷新父业面

    window.opener.location.reload() 2个方法都是刷新父窗口,但是其中还是有奥妙的哦.window.opener.location.reload();这个方法在强迫父窗口的时 ...

  9. LeetCode 20. Valid Parentheses(c++)

    利用栈的操作,遇到"(","[","{"即进栈,遇到")","]","}"判断是 ...

  10. 处理 oracle 数据库导入报错“IMP-00058: 遇到 ORACLE 错误 942”

    在导入数据文件的时候出现了下图错误: 经过多次百度搜索问题.得知问题错误方向: 仔细的查询了被导入数据的数据库的版本: 而 被导入的数据包 dmp 文件是从 oracle11g r2的版本导出的. 所 ...