情况：

　　父元素的盒子包含一个子元素盒子，给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值，而子元素和父元素的边距则没有发生变化。

解决方法：
1、修改父元素的高度，增加padding-top样式模拟（padding-top：1px；常用）
2、为父元素添加overflow：hidden；样式即可（完美）
3、为父元素或者子元素声明浮动（float：left；可用）
4、为父元素添加border（border:1px solid transparent可用）
5、为父元素或者子元素声明绝对定位

父元素与子元素之间的margin-top问题(css hack)（转载）的更多相关文章

  1. 父元素与子元素之间的margin-top问题

    父元素的盒子包含一个子元素盒子,给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值,而子元素和父元素的边距则没有发生变化. html代码: <div c ...

  2. 关于css中父元素与子元素之间margin-top的问题

    之前在使用经常遇到下面的问题: html: <div class="top"> <div class="one">I'm the fir ...

  3. css设置时父元素随子元素margin值移动

    父元素的盒子包含一个子元素盒子,给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值,而子元素和父元素的边距则没有发生变化. HTML,CSS: <div ...

  4. HTML 父元素与子元素之间的margin-top问题

    问题: 父元素的盒子包含一个子元素盒子,给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值,而子元素和父元素的边距则没有发生变化. 代码如下: <div ...

  5. 父元素与子元素之间的margin-top问题(css hack)

    hack: 父元素的盒子包含一个子元素盒子,给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值,而子元素和父元素的边距则没有发生变化. hytml代码: &l ...

  6. CSS 实现：父元素包含子元素，子元素垂直居中布局

    ☊[实现要求]:父元素包含子元素,子元素垂直居中布局 <div class="demo5"> <div class="child">A& ...

  7. JQuery 获取父级元素、同级元素、子元素等

    例: <div> <div id="div_1">这是内容1</div> <div id="div_2">这是内 ...

  8. jquery选择器 之 获取父级元素、同级元素、子元素

    jquery选择器 之 获取父级元素.同级元素.子元素 一.获取父级元素 1. parent([expr]): 获取指定元素的所有父级元素 <div id="par_div" ...

  9. jquery选择器如何获取父级元素、同级元素、子元素

    一.新建页面 <ul> <li>list item 1</li> <li>list item 2</li> <li class=&qu ...

随机推荐

  1. 【java】异常和处理

    (根据http://www.imooc.com/learn/110 陈码农老师教学视频总结)   一．异常体系结构 所有不正常类都继承于Throwable类 1.异常两个子类 error & ...

  2. idea项目部署

    idea新建项目: http://blog.csdn.net/wo541075754/article/details/46348135  详细 http://www.cnblogs.com/wql02 ...

  3. ctrl + d 在phpstorm 和 eclipse 中的不同含义

    Ctrl + d 在phpstrom是复制一行,非常的方便,但是eclipse中却是删除一行,非常的特别.感觉上,phpstorm更注重鼠标,但eclipse貌似更多鼠标和键盘的操作, 默认情况下[p ...

  4. 高可用性中的脑裂问题(split-brain problem in HA)(转)

    欢迎关注我的社交账号: 邮箱: jiangxinnju@163.com 博客园地址: http://www.cnblogs.com/jiangxinnju GitHub地址: https://gith ...

  5. 【CITE】C# 如何 实现一个窗体和另一个窗体始终保持相对的位置

    C# 如何 实现一个窗体和另一个窗体始终保持相对的位置,任由一个窗体移动,当点击按钮时,弹出的另一个窗体也与之保持相对位置(如左上角)你根据第一个窗体的location去算第二个窗体的location ...

  6. robotframework笔记11

    测试用例的语法 基本语法 测试用例构造测试用例表中可用 关键词. 关键字可以进口 测试库 或 资源 文件 或创建的 关键字表 的测试用例文件 本身. 测试用例表中第一列包含测试用例的名称. 一个 测试 ...

  7. Hibernate4+Spring JPA+SpringMVC+Volecity搭建web应用(二)

    SpringMVC.xml配置 <?xml version="1.0" encoding="UTF-8"?> <beans xmlns=&qu ...

  8. PHP读取文件夹目录，按时间排序，大小排序，名字排序

    工作中有时候会遇到文件存储数据,但是在前台显示的时候又因为没有数据库,无法使用上传或最后一次修改日期字段排序,所以有了如下代码: <?php $dir = "./";//目录 ...

  9. cf------(round)#1 C. Ancient Berland Circus(几何)

    C. Ancient Berland Circus time limit per test 2 seconds memory limit per test 64 megabytes input sta ...

  10. BZOJ3695 滑行

    转化模型就变成几层折射率不同的玻璃光要怎么走才能从(0, 0)到(x, y) 我们发现第一次光线射出去的角度确定,之后光的行程是确定的 而且角度和最后到达y时的x成正相关,于是可以二分! 然后物理学学 ...