处理DIV子级ZImargin-top下降,父级更着下降问题

html结构如下

<div id="top">
<div id="zi"></div>
</div>

css如下

#top{width:200px;
height:200px;
overflow:hidden;/*解决父级下降问题*/
}
#zi{width:200px;
height:100px;
nargin-top:20px;
}

注意:当子级margin-top下降问题,父级更着下降问题,只要在父级DIV中加入overflow:hidden;

处理FF margin-top下降问题的更多相关文章

  1. margin top 无效

    常出现两种情况: (一)margin-top失效 两个层box1和box2,box1具有浮动属性,box2没有,这时候设置box2的上边距margin-top没有效果. 解决办法: 1.box2增加f ...

  2. 左右margin top问题百分比值

    不想说今天心情有多差! 9点多開始发现一个"bug",需求是依据屏幕高度动态调整某个div的位置.代码大概是这种. <div style="margin-top: ...

  3. 理解css margin

    前提是对display:block元素 1 margin对没有width属性的元素,能影响其宽度,对于有width的则不起作用: 高度方面不受影响 此特性可用来排版 2 margin 与百分比 普通的 ...

  4. CSS中margin与padding的区别

    CSS边距属性定义元素周围的空间.通过使用单独的属性,可以对上.右.下.左的外边距进行设置.也可以使用简写的外边距属性同时改变所有的外边距.——W3School 边界(margin):元素周围生成额外 ...

  5. Margin and Padding in Windows Forms Controls

    https://msdn.microsoft.com/en-us/library/ms229627.aspx Margin and Padding Precise placement of contr ...

  6. 由浅入深漫谈margin属性1

    margin 在中文中我们翻译成外边距或者外补白(本文中引用外边距).他是元素盒模型(box model)的基础属性. (该文章解释是否正确有待商榷,目前我的实验结果为:在默认情况或者div左浮动的情 ...

  7. 不要告诉我你懂margin

    分类: Html/CSS | 转载请注明: 出自 海玉的博客 本文地址: http://www.hicss.net/do-not-tell-me-you-understand-margin/ 你真的了 ...

  8. margin四个元素的顺序

    如果margin给的是四个值比如:margin:0px 0px 0px 0px;代表:margin: top right bottom left代表从上右下左,顺时针方向.如果margin给的是三个值 ...

  9. CSS margin 属性

    设置外边距的最简单的方法就是使用 margin 属性. margin 属性接受任何长度单位,可以是像素.英寸.毫米或 em. margin 可以设置为 auto.更常见的做法是为外边距设置长度值.下面 ...

  10. IE6双倍margin间距解决方案

          问题:在IE6下如果某个标签使用了float属性,同时设置了其外补丁“margin:10px 0 0 10px”可以看出,上边距和左边距同样为10px,但第一个对象距左边有20px. 解决 ...

随机推荐

  1. Appium根据xpath获取控件

    如文章< Appium基于安卓的各种FindElement的控件定位方法实践>所述,Appium拥有众多获取控件的方法.其中一种就是根据控件所在页面的XPATH来定位控件. 本文就是尝试通 ...

  2. Appium+Robotframework实现Android应用的自动化测试-7:模拟器频繁挂掉的解决方案

    如果测试用例比较多,则当持续运行多个测试用例后,经常会出现模拟器崩溃或者Appium无法连接到该模拟器的情况出现. 经过分析,本人认为这应该是模拟器或者Appium的缺陷造成的,目前并没有直接的解决方 ...

  3. 深入理解 Win32 PE 文件格式

    深入理解 Win32 PE 文件格式 Matt Pietrek 这篇文章假定你熟悉C++和Win32. 概述 理解可移植可执行文件格式(PE)可以更好地了解操作系统.如果你知道DLL和EXE中都有些什 ...

  4. Core Data 多线程时多个context使用

    原文地址:http://blog.csdn.net/willmomo/article/details/19759413 写的非常好!我这里截取一点重要的,备份,请去原地址阅读! 本人去年10月份才接触 ...

  5. ACM/ICPC 之 暴力打表(求解欧拉回路)-编码(POJ1780)

    ///找到一个数字序列包含所有n位数(连续)一次且仅一次 ///暴力打表 ///Time:141Ms Memory:2260K #include<iostream> #include< ...

  6. jQuery修改页面元素的属性

    作为一个后台开发者,在web开发的时候会常常遇到修改前台页面的属性的问题.这两天我发现jQuery的$("#id").attr("prop","值&q ...

  7. codeforces 518B. Tanya and Postcard 解题报告

    题目链接:http://codeforces.com/problemset/problem/518/B 题目意思:给出字符串 s 和 t,如果 t 中有跟 s 完全相同的字母,数量等于或者多过 s,就 ...

  8. SharedPreferences详解(三)——存取图片

    MainActivity如下: package cc.sp; import java.io.ByteArrayInputStream; import java.io.ByteArrayOutputSt ...

  9. 【leetcode】Set Matrix Zeroes(middle)

    Given a m x n matrix, if an element is 0, set its entire row and column to 0. Do it in place. 思路:不能用 ...

  10. JS 保留两位小数问题收集

    1.使用四舍五入的方法,保留小数点后的两位小数: toFixed里面的参数表示保留的小数的位数,范围是0-20,超过20位就会报错了 <script> var num=22.127456; ...