常出现两种情况:

(一)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. redmine修改附件储存路径

    如果想把redmine 1.x.x 版本中的attachments files 放在自定义的目录(例如/home/darkofday/redmineAttachFile/).执行下列命令:cd /ho ...

  2. Codeforces Round #360 (Div. 2) D. Remainders Game

    D. Remainders Game time limit per test 1 second memory limit per test 256 megabytes input standard i ...

  3. Fedora安装opengl

    Fedora和Ubuntu下安装OpenGL开发环境配置(我整理的)OpenGL开发库的详细介绍fedora23 安装OpenGL 开发OpenGL工程需要3个库文件和对应的头文件:libglut.s ...

  4. [Vue]组件——组件的data 必须是一个函数

    普通的Vue实例data是一个对象: data: { count: 0 } 组件的data是一个方法: data: function () { return { count: 0 } } 详情见官网: ...

  5. vim 的寄存器

    If you've been following my series on Vim, it should be clear now that Vim has a pretty clear philos ...

  6. 十八 Python分布式爬虫打造搜索引擎Scrapy精讲—Scrapy启动文件的配置—xpath表达式

    我们自定义一个main.py来作为启动文件 main.py #!/usr/bin/env python # -*- coding:utf8 -*- from scrapy.cmdline import ...

  7. jQuery-瀑布流的取巧做法分享

      分析:瀑布流,做法有2种 (1)绝对定位方案:每个单元格设置为绝对定位,通过计算,分别设置 top , left 即可实现 (2)浮动方案:弄N列布局(浮动),然后图片数据,按顺序依次插入,如N为 ...

  8. 七种常见经典排序算法总结(C++)

    最近想复习下C++,很久没怎么用了,毕业时的一些经典排序算法也忘差不多了,所以刚好一起再学习一遍. 除了冒泡.插入.选择这几个复杂度O(n^2)的基本排序算法,希尔.归并.快速.堆排序,多多少少还有些 ...

  9. day5-import机制详述

    一.概述 但凡稍微复杂一些的python程序,都不可避免地需要import一些内置模块或外部模块,当然也有可能import进来一个package,java语言中也经常见到各种import打头,可见其用 ...

  10. laravel中composer镜像服务的方式

    系统全局配置:即将配置信息添加到Composer的全局配置文件config.json中. 单个项目配置:将配置信息添加到某个项目的composer.json文件中. 例1:修改Composer的全局配 ...