浏览器顶部设置margin-top时存在的bug
浏览器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的更多相关文章
- IE7 浏览器下面设置text-indent属性变成margin属性BUG
问题来源 今天做项目的时候发现了一个问题,在使用text-indent属性对元素进行缩进是发现在360浏览器下发生了元素偏移,跟margin-left的效果一样,打开f12发现3607.1浏览采用的i ...
- overflow-x和overflow-y其中一个设置为visible时的奇怪现象
当overflow-x和overflow-y其中一个设置为visible时,如果另一个不是visible,那么它会被自动重置为auto 看看效果先: 第一次遇到这个问题时,我还以为是chrome的一个 ...
- 在java代码中设置margin
我们平常可以直接在xml里设置margin,如: <ImageView android:layout_margin="5dip" android:src="@dra ...
- browserCaps与浏览器功能设置
使用 Web.config 文件中的 browserCaps 元素来定义浏览器的行为在 .NET Framework 2.0 中被否决,但仍受支持.此元素中的数据与浏览器定义文件 (.browser) ...
- Jquery DIV滚动至浏览器顶部位置固定
获取元素(这里定位元素A)距离顶部的高度,接着设定scroll滚动的事件,比如超过那个高度,把A的位置设定为fixed,小于该高度,修改回relative. 方法一: $(function() { v ...
- Jquery DIV滚动至浏览器顶部后固定不动代码
$(function(){ //获取要定位元素距离浏览器顶部的距离 var navH = $(".win").offset().top; //滚动条事件 $(window).scr ...
- Android如何在java代码中设置margin
习惯了直接在xml里设置margin(距离上下左右都是10dip),如: <ImageView android:layout_margin="10dip" android:s ...
- 获取DIV与浏览器顶部相聚一定位置之后移动DIV
获取元素(这里定位元素A)距离顶部的高度,接着设定scroll滚动的事件,比如超过那个高度,把A的位置设定为fixed,小于该高度,修改回relative. 方法一: $(function() { ...
- 转--Android如何在java代码中设置margin
======== 3 在Java代码里设置button的margin(外边距)? 1.获取按钮的LayoutParams LinearLayout.LayoutParams layoutParams ...
随机推荐
- iOS开发支付篇——内购(IAP)详解
1 <em>内购所需要的资料整理总结,史上最完整的,哈哈哈哈哈哈</em> 思维导图 重点总结: 1 2 3 4 5 6 7 8 9 10 11 12 13 1.获取内购列表( ...
- msql 数据类型
1.数据类型 #1. 数字: 整型:tinyinit int bigint 小数: float :在位数比较短的情况下不精准 double :在位数比较长的情况下不精准 0.0000012301231 ...
- python reportlab 生成table
''' Table(data, colWidths=None, rowHeights=None, style=None, splitByRow=, repeatRows=, repeatCols=, ...
- asp.net core-16.EF Core Migration
左边的是基于visual studio code 右边的是基于visual studio 如果想要在数据库的AspNetUsers表里添加一列 然后可以发现 在Data下的Migrations文件夹下 ...
- SpringCloud Hystrix/Feign 整合 Hystrix 后首次请求失败解决方案
- Seaborn（一）之风格管理
Seaborn简介 seaborn同matplotlib一样,也是Python进行数据可视化分析的重要第三方包.但seaborn是在 matplotlib的基础上进行了更高级的API封装,使得作图更加 ...
- ElasticSearch创建动态索引
ElasticSearch创建动态索引 需求:某实例需要按照月份来维护,所以之前的“写死”索引的方式当然不行了.通过百度和看SpringDataElasticSearch官方文档,最后解决了这个问题. ...
- VBA if语句
一个if语句由一个布尔表达式和一个或多个语句组成.如果条件被评估为True,则执行If条件块下的语句.如果条件被评估为False,则执行If循环块后面的语句. 语法 以下是VBScript中的If语句 ...
- [基础累积] C#计算时间差
TimeSpan nowTime = new TimeSpan(DateTime.Now.Ticks); TimeSpan nextTime = new TimeSpan(nextDispatcher ...
- docker alpine wkhtmltopdf
截止2019.08 wkhtmltopdf 还没有 alpine 的版本 如需使用 需要在 alpine 环境中编译 生成 wkhtmltopdf (使用 apk add wkhtmltopdf ...