浏览器bug
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{
padding: 0;
margin: 0;
border: none;
}
.container{
width: 1200px;
height: 600px;
margin: 0 auto;
background: #abcdef;
overflow: hidden;/*防止子元素设置margin-top值，把父元素一直往下顶，不正常显示，这是浏览器BUG，可以在父元素添加overflow:hidden;来解决。或者设置父元素padding-top:0.01px;也行。*/
}
div{
width: 50px;
height: 50px;
margin: 0 auto;
margin-top: 30px;
background: #f00;
}
</style>
</head>
<body>
<div class="container">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</body>
</html>

浏览器顶部设置margin-top时存在的bug的更多相关文章

  1. IE7 浏览器下面设置text-indent属性变成margin属性BUG

    问题来源 今天做项目的时候发现了一个问题,在使用text-indent属性对元素进行缩进是发现在360浏览器下发生了元素偏移,跟margin-left的效果一样,打开f12发现3607.1浏览采用的i ...

  2. overflow-x和overflow-y其中一个设置为visible时的奇怪现象

    当overflow-x和overflow-y其中一个设置为visible时,如果另一个不是visible,那么它会被自动重置为auto 看看效果先: 第一次遇到这个问题时,我还以为是chrome的一个 ...

  3. 在java代码中设置margin

    我们平常可以直接在xml里设置margin,如: <ImageView android:layout_margin="5dip" android:src="@dra ...

  4. browserCaps与浏览器功能设置

    使用 Web.config 文件中的 browserCaps 元素来定义浏览器的行为在 .NET Framework 2.0 中被否决,但仍受支持.此元素中的数据与浏览器定义文件 (.browser) ...

  5. Jquery DIV滚动至浏览器顶部位置固定

    获取元素(这里定位元素A)距离顶部的高度,接着设定scroll滚动的事件,比如超过那个高度,把A的位置设定为fixed,小于该高度,修改回relative. 方法一: $(function() { v ...

  6. Jquery DIV滚动至浏览器顶部后固定不动代码

    $(function(){ //获取要定位元素距离浏览器顶部的距离 var navH = $(".win").offset().top; //滚动条事件 $(window).scr ...

  7. Android如何在java代码中设置margin

    习惯了直接在xml里设置margin(距离上下左右都是10dip),如: <ImageView android:layout_margin="10dip" android:s ...

  8. 获取DIV与浏览器顶部相聚一定位置之后移动DIV

    获取元素(这里定位元素A)距离顶部的高度,接着设定scroll滚动的事件,比如超过那个高度,把A的位置设定为fixed,小于该高度,修改回relative. 方法一: $(function() {  ...

  9. 转--Android如何在java代码中设置margin

    ========  3 在Java代码里设置button的margin(外边距)? 1.获取按钮的LayoutParams LinearLayout.LayoutParams layoutParams ...

随机推荐

  1. SSH简介及两种远程登录的方法

    出处 https://blog.csdn.net/li528405176/article/details/82810342 目录 SSH的安全机制 SSH的安装 启动服务器的SSH服务 SSH两种级别 ...

  2. 【转】spring基础：@ResponseBody，PrintWriter用法

    理解:很多情况我们需要在controller接收请求然后返回一些message. 1.在springmvc中当返回值是String时,如果不加@ResponseBody的话,返回的字符串就会找这个St ...

  3. redis 基本数据类型及使用

    文章目录 相对其它 nosql 数据库的优势 杂项知识 基本数据类型 Key 关键字 String 类型(单键单值) List 类型 (单键多值) Set 类型 (单键多值) Hash类型 (KV模式 ...

  4. tomcat中server.xml各项配置详解

     详见大佬的文章,乐于做大佬文章的搬运工. http://www.cnblogs.com/starhu/p/5599773.html

  5. 2019杭电多校二 L. Longest Subarray (线段树)

    大意: 给定序列$a$, 元素范围$[1,C]$, 求一个最长子序列, 满足每个元素要么不出现, 要么出现次数$\le K$. 枚举右端点, 考虑左端点合法的位置. 显然一定是$C$种颜色合法位置的交 ...

  6. C# wsdl.exe 生成类文件

    wsdl.exe D:\XXX\demand\demand.\wsdl\XXX.wsdl /\wsdl\class 在 vs tools:Developer Command Prompt For VS ...

  7. 怎样修改原型对象prototype

    修改原型对象的方法分为两种情况, 一种是对原型对象的属性方法做增删改, 一种改变原型对象的指向. 第一种: 对原型对象的属性/方法做增删改 function Person(name){ this.na ...

  8. （七）发送、接收SOAP消息（以HttpClient方式）（2）

    一.为什么要用soap 原本我们使用web服务都是根据wsdl生成客户端(生成一堆java文件)然后再调用,本章节讲解如何用soap消息来替代这种方式. 二.SOAP消息格式 SOAP(简单对象访问协 ...

  9. MySQL INNER JOIN子句介绍

    MySQL INNER JOIN子句介绍 MySQL INNER JOIN子句将一个表中的行与其他表中的行进行匹配,并允许从两个表中查询包含列的行记录. INNER JOIN子句是SELECT语句的可 ...

  10. java 框架-消息队列ActiveMQ

    https://www.jianshu.com/p/ecdc6eab554c ActiveMQ从入门到精通(一) 22017.03.11 21:40:42字数 2650阅读 57286 这是关于消息中 ...