margin塌陷现象(即在内层设置margin-top无效的解决办法)

时间:2022-09-17 17:44:18

    有两个有嵌套关系的div,如果外层div的父元素的padding值为0,那么内层子div的margin-top或margin-bottom的值会转移给外层的父div,即magrin塌陷现象。

    解决办法:

      1.在父元素div上加上:overflow:hidden;

      2.把margin-top外边距改成padding-top内边距;

      3.父元素div产生边距重叠的边有不为0的padding或宽度不为0且style不为none的border;父元素添加padding-top:1px;

      4.让父元素生成一个 block formating context,以下属性可以实现
            * float: left/right
            * position: absolute
            * display: inline-block/table-cell(或其他 table 类型)
           * overflow: hidden/auto
            父层div加:position: absolute; 

margin塌陷现象(即在内层设置margin-top无效的解决办法)的更多相关文章

  1. wordpress设置固定链接无效的解决办法

    声明:本人用的是Ubuntu 10.04 LAMP服务 以下内容是针对在Apache服务器下Wordpress修改固定链接出错无效的解决办法: 如果改了固定链接以后出问题,请查看Wordpress根目 ...

  2. 设置overflow:auto无效的解决办法

    做项目中经常要用到滚动条,有时候给div设置overflow无效. 遇到这样的问题,只需要在 F12 Elements面板检查一下要设置overflow的元素的宽高是否大于父级元素宽高. (overf ...

  3. centos设置中文输入法无效的解决办法

    安装 im-chooser: yum install im-chooser 回到当前使用的普通用户,设置 ibus 输入法为默认输入系统: imsettings-switch ibus

  4. xadmin下设置“use_bootswatch = True”无效的解决办法

    环境: python 2.7 django 1.9 xadmin采用源代码的方式引入到项目中 问题: 在xadmin使用的过程中,设置“use_bootswatch = True”,企图调出主题菜单, ...

  5. C# 反射 设置字段值无效的解决办法

    FieldInfo.SetValue的原型是:void SetValue(object obj, object value)当你传递一个值类型(结构是值类型)的时候,它要转化成object,也就是要装 ...

  6. Web.Debug.config和Web.Release.config设置xdt:Transform无效的解决办法

    在VS中右键网站>发布时xdt:Transform 生效.但是使用tfs的build时,build可以正常通过,但是web.release.config中的xdt:Transform 无效,其它 ...

  7. Idea内存设置idea.vmoptions无效的解决办法

    原因:貌似是因为maven的问题 解决办法 结果

  8. margin塌陷现象

    如果两个盒子是包含关系,如果让子盒子在父盒子之内向下平移100px:(margin塌陷现象)解决方案: padding , border , overflow <!DOCTYPE html&gt ...

  9. HTML给div设置百分比高度无效的解决方式 - 库塔姆斯 - CSDN博客

    原文:HTML给div设置百分比高度无效的解决方式 - 库塔姆斯 - CSDN博客 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/HobHunter ...

  10. 设置height&colon;100&percnt;无效的解决方法

    设置height:100%无效的解决方法 刚接触网页排版的新手,常出现这种情况:设置table和div的高height="100%"无效,使用CSS来设置height:" ...

随机推荐

  1. Autofac - 装配

    从容器中的可用服务中, 选取一个构造函数来创造对象, 这个过程就是自动装配. 一.选择构造函数 默认情况下, autofac会使用无参构造函数, 去创建对象. 我将Person类稍微修改了下. pub ...

  2. mongo安全:增加用户名密码

    0.简述:在非auth下创建账户,然后重启 1.以不需要用户名密码的方式启动mongodb 2.运行客户端mongo,输入以下指令 show dbs;use admin;db.createRole({ ...

  3. iOS:CYLTabBarController【低耦合集成TabBarController】

    导航 与其他自定义TabBarController的区别 集成后的效果 项目结构 使用CYLTabBarController 第一步:使用CocoaPods导入CYLTabBarController ...

  4. 76&period;Android之EventBus源码解析

    转载:http://p.codekk.com/blogs/detail/54cfab086c4761e5001b2538 1. 功能介绍 1.1 EventBus EventBus 是一个 Andro ...

  5. 【C解毒】怎样写main&lpar;&rpar;函数

    [C解毒]怎样写main()函数(出处: CUNIX论坛)

  6. JAVA中IO总结

    JAVA中IO流主要分为两大类: 字节流:InputStream+OutputStream 字符流:Reader+Writer 字节流: InputStream是所有字节输入流的父类 OutputSt ...

  7. uilib库gdi句柄泄漏bug修复,duilib防止gdi泄漏的小提醒

    转载请说明原出处,谢谢~~ 今天下午群友的网友让我帮忙看一下的duilib程序的问题,程序中包含了List控件,会定时清除所有子项目然后重新添加.但是程序运行一段时间后会自己崩溃!我编译了源码运行后在 ...

  8. tensorflow-cnn

    需要安装 python,numpy,tensorflow,运行代码即可. tensorflow很好装,用pip安装即可. 可以参照http://wiki.jikexueyuan.com/project ...

  9. jquery选中checkbox多选项并添加到文本框中

    <script> function check(){ var dd = ""; if($("input[type='checkbox'][name='moke ...

  10. T410升级笔记

      T410 win7 旗舰版 32 sp1 三星  DDR3 1066 mhz core i5 M 540 2.53GHZ 双核 日立 HTS725032A9A364 320G/7200转/分 sa ...