关于overflow的问题
<head>
<title></title>
<style type="text/css">
body
{
margin: 0;
padding: 0;
}
#father
{
width: 500px;
height: 400px;
background: pink;
border: 1px solid;
}
#child
{
width: 100px;
height: 50px;
margin-top: 20px;
background: blue;
}
</style>
</head>
<body>
<div id="father">
<div id="child">
</div>
</div>
</body>
给子div添加margin-top: 20px,发现父子DIV都一起相对BODY下移了20PX,为何不是只是子DIV下移20PX ? 如果我给父DIV添加border: 1px solid,就可以实现父DIV不动,只是子DIV相对父DIV下移了20PX,难道就一定要设置父DIV的border才能实现吗?
给父亲div 设置 overflow: hidden;有个叫 bfc 的东西 叫 块级元素格式化上下文 overflow hidden 或者描边可以触发 bfc 就可以解决这个问题。
overflow 属性:http://www.w3school.com.cn/cssref/pr_pos_overflow.asp
关于overflow的问题的更多相关文章
- 【转载】C# 中的委托和事件(详解)
<div class="postbody"> <div id="cnblogs_post_body" class="blogpost ...
- Stack Overflow 排错翻译 - Closing AlertDialog.Builder in Android -Android环境中关闭AlertDialog.Builder
Stack Overflow 排错翻译 - Closing AlertDialog.Builder in Android -Android环境中关闭AlertDialog.Builder 转自:ht ...
- css:overflow属性妙用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- overflow:hidden与margin:0 auto之间的冲突
相对于父容器水平居中的代码margin:0 auto与overflow:hidden之间存在冲突.当这两个属性同时应用在一个DIV上时,在chrome浏览器中将无法居中.至于为啥我也不明白.
- 移动端浏览器body的overflow:hidden并没有什么作用
今天突然遇到一个问题,使用li模拟select,但是碰到一个很尴尬的问题,给body加了overflow:hidden,但是body并没有禁止滚动条,滚动条依旧顺滑. <!DOCTYPE htm ...
- Stack Overflow: The Architecture - 2016 Edition(Translation)
原文: https://nickcraver.com/blog/2016/02/17/stack-overflow-the-architecture-2016-edition/ 作者:Nick Cra ...
- overflow:hidden清除浮动原理
overflow:hidden的意思是超出部分去掉,如果父元素height为auto,内部元素浮动,势必会将内部元素全部隐藏,故计算出内部浮动高度顺便清除浮动.
- 解决overflow:hidden在安卓微信页面没有效果的办法
在做h5移动端时候,发现overflow: hidden;在安卓微信页面失效问题,经研究和实验,用第三种方法和第四种方法可以解决! 1.完全隐藏 在<boby>里加入scroll=&quo ...
- overflow
1. 隐藏x轴滚动条,垂直有滚动条: <body> <div style="width:100px;height:150px;overflow:scroll;overflo ...
- allocation size overflow
var cityID="1"; var areaHtml=""; var storeHtml=""; //区域异步 function Get ...
随机推荐
- 四大组件之ContentProvider小结
总结提高,与君共勉 1.什么是Content Provider 内容提供器( Content Provider)主要用于在不同的应用程序之间实现数据共享的功能,提供了一套完整的机制,允许一个程序访问另 ...
- 敦泰FT6X06单层自容调屏
总的概括来说,自电容调屏在配置好通道个数和顺序后,只需调整AFE相关的设置参数使各通道的Raw Data和CI值符合定义的标准即可.– AFE是模拟前端的缩写-Analog Front End• Ra ...
- 反对网抄,没有规则可以创建目标"install" 靠谱解答
在ubuntu下遇到这个问题,原因其实很简单,你不能用WINDWOS下的方法用图形方式打开,然后点了一下按扭"解压缩",生成了一个文件夹. 的确,这个文件夹看起来和正常的没有什么区 ...
- [转]C# 之DLL调用(托管与非托管)
每种编程语言调用DLL的方法都不尽相同,在此只对用C#调用DLL的方法进行介绍.首先,您需要了解什么是托管,什么是非托管.一般可以认为:非托管代码主要是基于win 32平台开发的DLL,activeX ...
- LeetCode之“链表”:Intersection of Two Linked Lists
此题扩展:链表有环,如何判断相交? 参考资料: 编程判断两个链表是否相交 面试精选:链表问题集锦 题目链接 题目要求: Write a program to find the node at whic ...
- 三消游戏FSM状态机设计图
三消游戏FSM状态机设计图 1) 设计FSM图 2) smc配置文件 ///////////////////////////////////////////////////////////////// ...
- SpriteBuilder中同父节点的显示顺序
如下图: 到目前为止,GameScene依赖于节点在SpriteBuilder中的顺序去决定其绘制的顺序. level content(_levelNode)被首先绘制,然后GameMenuLayer ...
- SharePoint 2013 页面访问,Url中间多一段"_layouts/15/start.aspx#"
问题描述: 我想访问如下页面 http://Host/_layouts/15/ManageFeatures.aspx 点击以后页面地址没有错,但是中间多了一段"_layouts/15/sta ...
- android EventBus详解(一)
EventBus 是一款针对Android优化的发布/订阅事件总线.主要功能是替代Intent, Handler, BroadCast 在 Fragment,Activity,Service,线程之间 ...
- Linux进程快照相关知识
查寻内核版本 uname -a // uname -r 进程快照 ps report a snapshot of the current processes USER ...