给子元素设置margin-top的时候父元素的也会受影响。会产生子元素和父元素margin合并的问题。

解决办法：

给父元素设置padding。或者border
把父子的margin之间隔开。
一般来说，为父元素设置一个1px的padding-top就可以了。

ss 如何解决margin-top使父元素margin失效的更多相关文章

  1. 解决 css 浮动后 父元素高度失效问题

    应用场景 子元素标签使用 浮动后,会出现浮在父元素上层,脱离了.导致父元素没办法根据子元素的高度而变化,提供以下解决方案. 解决代码 把 '.clearfix ' Class 样式添加到 父元素即可. ...

  2. 布局时margin会影响父元素

    布局时margin会影响父元素.md 在布局使用margin时 <div class="login-bg"> <div class="login&quo ...

  3. 定位之float 同一父元素的float相互影响，float是margin盒子在父元素的padding盒子内

  4. margin折叠-从子元素margin-top影响父元素引出的问题

    正在做一个手机端电商项目,顶部导航栈的布局是一个div包含一个子div,如果给在正常文档流中的子div一个垂直margin-top,神奇的现象出现了,两父子元素的边距没变,但父div跟着一起往下走了! ...

  5. css float父元素高度塌陷

    css float父元素高度塌陷 float 使父元素高度塌陷不是BUG,反而是标准. float 原本是为了解决文字环绕才出现的. 当然有的时候要解决高度塌陷的问题 以下几个方法可以解决float ...

  6. CSS子元素在父元素中水平垂直居中的几种方法

    1. 水平居中(margin: auto;)子父元素宽度固定,子元素上设置 margin: auto; 子元素不能设置浮动,否则居中失效. #div1{ width: 300px; height: 3 ...

  7. 多方法解决设置width:100%再设置margin或padding溢出的问题

    2019独角兽企业重金招聘Python工程师标准>>> 当设置了父元素的宽度,子元素设置宽度为100%后再在加上子元素上添加padding或margin值就会溢出.举个例子: < ...

  8. 子元素margin-top后，跟父元素一起下沉

    在一个<div>元素中嵌套一个子div,同时设置子div的margin-top,结果,父元素和子元素一起下沉,留出来个空白区域. 原因就是:        一个盒子如果没有上补白(padd ...

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

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

随机推荐

  1. CentOS 下安装操作Memcached

    Memcached 是一个高性能的分布式内存对象缓存系统,用于动态Web应用以减轻数据库负载.它通过在内存中缓存数据和对象来减少读取数据库的次数,从而提高动态.数据库驱动网站的速度.Memcached ...

  2. java数字保留两位小数四舍五入

    import java.math.BigDecimal; import java.text.DecimalFormat; import java.text.NumberFormat; public c ...

  3. POJ 3369 Meteor Shower （BFS，水题）

    题意:给定 n 个炸弹的坐标和爆炸时间,问你能不能逃出去.如果能输出最短时间. 析:其实这个题并不难,只是当时没读懂,后来读懂后,很容易就AC了. 主要思路是这样的,先标记所有的炸弹的位置,和时间,在 ...

  4. C#学习笔记（九）：LINQ和表达式树

    LINQ LINQ:语言集成查询(Language Integrated Query)是一组用于c#和Visual Basic语言的扩展.它允许编写C#或者Visual Basic代码以查询数据库相同 ...

  5. 如何彻底隐藏iOS7应用的status bar

    用xcode5开发新的iOS游戏,发现一个坑爹的现象,虽然我已经在info.plist里面把Status bar is initially hidden设置成了YES,但在设备上一跑还是看到丑陋的st ...

  6. C#IEnumerator.MoveNext 方法 ()

    将枚举数推进到集合的下一个元素. 命名空间:   System.Collections程序集:  mscorlib(mscorlib.dll 中) 语法: bool MoveNext() 返回值 Ty ...

  7. LINQ to XML 从逗号分隔值 (CSV) 文件生成 XML 文件

    参考:http://msdn.microsoft.com/zh-cn/library/bb387090.aspx 本示例演示如何使用 语言集成查询 (LINQ) 和 LINQ to XML 从逗号分隔 ...

  8. 【转】VIM 快速注释

    我是用自己自定义的,跟你分享一下吧.希望能帮到你. 在.vimrc中加入下面的语句:vmap <C-S-P>    dO#endif<Esc>PO#if 0<Esc> ...

  9. UML视图（九）部署图

    一.什么是部署图? 部署图对面向对象系统的物理方面建模,描写叙述系统执行时节点.构件实例及其对象的配置.主要用来在部署系统时涉及到的硬件(处理器和设备)进行建模. 二.部署图的组成元素? 部署图主要包 ...

  10. Ruby on Rails Tutorial 第一章 之 Git项目管理

    1.安装和设置 (1)git的安装(略) (2)初始化设置 $ git config --global user.name "LihuaSun" $ git config --gl ...