常出现两种情况：

（一）margin-top失效

两个层box1和box2，box1具有浮动属性，box2没有，这时候设置box2的上边距margin-top没有效果。

解决办法：

1.box2增加float属性

2.box1与box2之间增加一层"<divstyle="clear:both;"></div>"

（二）子元素设置margin-top作用于父容器

当给box2设置margin-top时，在FF下仅作用于父容器。

解决办法：

1.给父容器box加overflow:hidden;属性

2.父容器box加border除none以外的属性

3.用父容器box的padding-top代替margin-top

margin top 无效的更多相关文章

  1. 行内元素的padding和margin是否无效

    html中元素分为三种:块级元素.行内元素(也叫内联元素),内联块级元素. 常用块级元素:<div>.<p>.<h1>...<h6>.<ol> ...

  2. IOS机型margin属性无效问题

    这个问题很多小伙伴都有遇到,这次本猿也遇到了,记录一笔. 结论:简单的解决办法margin换padding!如有误,请大神不吝赐教.在Chrome浏览器移动端测试iphone5,打开的也是没问题的(这 ...

  3. $("body").animate({"scrollTop":top})无效的问题

    问题 我在个人站点的左下角和右下角各自使用了如下代码来将页面滚动到顶部和底部: $("body").animate({scrollTop:0},800); $("body ...

  4. 关于苹果iPhone手机对页面margin属性无效的解决方法一（如有错误，请留言批评）

    这个问题,是在给商城网站底部footer设置margin属性的时候发现的,先把出现问题的截图发出来看一下 ​安卓手机,打开正常 ​iphone6 p 打开出现的问题(无视margin-bottom:6 ...

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

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

  6. div、ul、li等无法居中问题，text-align无效 margin auto无效

    很简单.如果是div,直接把div换成: <table align="center">        <tr>            <td> ...

  7. 2016/2/25 1， margin auto 垂直方向测试 无效 2，margin重叠 3，哪些是块状哪些是内联 4，display：block inline 导航栏把内联转块状最常见+ 扩展

    1.利用margin auto完成首页居中,并自行研究,竖直方向用margin auto,是什么效果#container{width:1002px;margin: 0px auto;}    竖直方向 ...

  8. 理解CSS外边距margin

    前面的话   margin是盒模型几个属性中一个非常特殊的属性.简单举几个例子:只有margin不显示当前元素背景,只有margin可以设置为负值,margin和宽高支持auto,以及margin具有 ...

  9. 深入理解CSS中的margin负值

    前面的话 margin属性在实际中非常常用,也是平时踩坑较多的地方.margin折叠部分相信不少人都因为这样那样的原因中过招.margin负值也是很常用的功能,很多特殊的布局方法都依赖于它.它看似简单 ...

随机推荐

  1. 在php中define和const定义常量的区别

    define和const都可以用来定义常量,但是const定义常量的时候大小写敏感,而define可以通过设置第三个参数为true的时候来取消大小写敏感! 如图: 引用地址:点这里

  2. Deep Learning入门

    今天在看电影的过程中我忽然想起来几件特别郁闷的事,我居然忘了上周三晚上的计算机接口的实验课!然后我又想起来我又忘了上周六晚上的就业指导!然后一阵恐惧与责备瞬间涌了上来.这事要是在以前我绝对会释然的,可 ...

  3. ExtJs4.2.1中的Ext.grid.GridPanel选择行回车事件

    网上大多说的是“rowdblclick” 其实是“itemdblclick” 这个东西坑了我一上午.

  4. 事后调试.ZC资料

    1.查了一下,Delphi 程序 可以生成 map文件,可以用来 根据崩溃的内存报错 定位出错的代码位置 2.但是,Delphi程序 无法再崩溃的时候 生成dump文件 (这个不一定,研究了再说.记得 ...

  5. 正确的使用pod install 和 pod update

    pod install 在项目中第一次使用CocoaPods, 进行安装的时候使用这个命令. 在Podfile中增加或删除某个pod后, 也是使用这个命令. 而不是pod update. 每次运行po ...

  6. 【Python】解决Python脚本 在cmd命令行窗口运行时，中文乱码问题

    问题描述 python2.X,代码中指定了UTF-8,但是在cmd命令行窗口时,打印的中文仍然会乱码 在python3不存在该问题 运行结果: 原因 搜索得知,中文windows默认的输出编码为gbk ...

  7. mysql数据库建表

    主键的问题: 简单的id递加.不过在实习的时候,因为id递增的问题,导致一个项目最后好像产生了严重的问题.所以递增适合小型项目,对我们的项目来说90%足够可以用的. 一些限制: 一般就非空就行,唯一的 ...

  8. Shell date 命令详解

    格式: date [选项] ... [+格式] 选项说明: -d ,--date=字符串 显示指定字符串所描述的时间 格式说明: 例子1: #!/bin/bash ##. 获取当前系统时间 YYYY- ...

  9. 使用Idea工具nodeJS+mysql开发项目

    一.MySQL Server的安装 1.mysql官网下载文件包:[我使用的版本是:mysql_5.7.17] 2.解压Zip压缩包: 3.安装:命令行:D:\soft\mysql-5.7.17-wi ...

  10. HDU5137-最短路-删点

    How Many Maos Does the Guanxi Worth Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 512000/5 ...