这是因为父元素的padding设置为0时所产生的bug,它自动将margin-top提升到了父元素上,所以此时我们所设置的margin-top自动就到父元素上了,解决方案:

1.给父元素添加一个padding,例如:padding-top:1px;

2.给父元素设置overflow:hidden;

3.把子元素设置成一个BFC,例如:{display:table-cell;position:absolute;overflow:hidden},父元素的位置设置为绝对定位。

div嵌套时,子元素设置margin-top失效问题的更多相关文章

  1. div设置overflow-scroll滚动之后,jq获取其子元素的offset.top出现问题。

    先上个图: 布局很简单,左右超过屏幕的部分自行滚动. 1. html <div class="ce-container"> <div class="ce ...

  2. 关于元素设置margin-top能够改变body位置的原因及解决(子元素设置margin-top改变父元素定位)

    关于元素设置margin-top能够改变body位置的原因及解决(子元素设置margin-top改变父元素定位) 起因:在进行bootstrap的.navbar-brand内文字设置垂直居中时采用li ...

  3. 子元素设置margin-top后,父元素跟随下移的问题

    子元素设置margin-top后,父元素跟随下移的问题 <!DOCTYPE html> <html lang="en"> <head> < ...

  4. CSS子元素设置margin-top作用于父容器?

    CSS子元素设置margin-top作用于父容器? 原因: In this specification, the expression collapsing margins means that ad ...

  5. 解决:子元素设置margin-top,父元素也受影响的问题

    <!doctype html><html> <head> <meta charset="UTF-8"> <title>子 ...

  6. 解决div嵌套时IE8和FF无法自适应高度

    解决div嵌套时IE8和FF无法自适应高度 还是做类似新浪评论回复的时候,将回复的DIV嵌套在一个DIV中,然后点击回复的时候显示子DIV,这是父DIV的高度是会变化的,于是我将父DIV的高度设置为h ...

  7. 给子元素设置margin-top无效果的一种解决方法

    在写一个登陆界面的时候,设置登录按钮的margin-top时出了问题 先是这么写的 <div style="margin-top:30px"> <a style= ...

  8. 解决子元素设置margin-top,效果到父元素上的问题

    有时当我们设置子元素的margin-top,但是却发现子元素没有出现上外边距的效果,反而是父元素出现了上外边距的效果. 这种问题的解决方法如下: 1.给父元素加边框. 2.给父元素设置padding- ...

  9. 子元素设置margin-top作用到了父元素

    子元素设置margin-top,父元素也受影响 解决办法:给父元素加个padding或border或overflow:hidden或父元素加前置内容生成 CSS中盒模型的理解

随机推荐

  1. DCloud-HTML5+:5+ App开发入门指南

    ylbtech-DCloud-HTML5+:5+ App开发入门指南 1.返回顶部 1. 5+ App开发入门指南 App App入门 HTML5 Plus应用概述 HTML5 Plus移动App,简 ...

  2. ubuntu下mysql的安装与配置

    1.安装,安装的过程中会提示你设置 MySql的"root"密码 sudo apt-get install mysql-server mysql-client 2.把  /etc/ ...

  3. 使用unlist将日期型数据的列表转换为向量时,出现的异常

    在使用unlist函数,将日期型的列表,转换为向量时,不会得到期望的结果,如下: > dateLst <- list(Sys.Date()) > dateLst [[1]] [1] ...

  4. 项目清理和删除svn信息(转)

    svn信息是根据文件夹里面的 .svn 文件夹保存相关配置的,删除此文件夹即可去掉svn信息: linux下: find . -type d -name ".svn"|xargs ...

  5. static_cast” : 无法从“void (__thiscall CMainFrame::* )(NMTOOLBARA *,LRESULT *)”转换为“void (__thiscall CCmdTarget::* )(NMHDR *,LRESULT

    static_cast” : 无法从“void (__thiscall CMainFrame::* )(NMTOOLBARA *,LRESULT *)”转换为“void (__thiscall CCm ...

  6. installshield 6109错误解决方案

    电脑重装了一下过后,运行打包程序就一直报6109错误,网上也没有查找出相关答案,真是急死了,后来无意发现输出项目的发布路径和当前自己setup的路径不一致,由于移动了文件夹位置,这个路径没有跟随修改, ...

  7. 条款29:为“异常安全”而努力是值得的

    当异常被抛出时,带有异常安全性的函数: 1.不泄露任何资源 2.不允许数据败坏   异常安全函数提供以下三个保证之一: 1.基本承诺:如果异常被抛出,程序内的任何事物仍然保持在有效的状态下.没有任何对 ...

  8. SQL中SUM函数和CASE WHEN联合使用

    SELECT SUM(case WHEN sex=1 then 1 else 0 end )as '男生', SUM(case when sex =2 then 1 else 0 end )'女生'F ...

  9. 每次移1px的无缝轮播图

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. 蓝桥杯T126(xjb&大数开方)

    题目链接:http://lx.lanqiao.cn/problem.page?gpid=T126 题意:中文题诶- 思路:显然被翻转了奇数次的硬币为反面朝上,但是本题的数据量很大,所以O(n^2)枚举 ...