首页 > 其他 > 详细

关于div内部绝对定位的div,位置并不根据父元素的来定位的笔记

时间:2019-09-03 19:13:29      阅读:143      评论:0      收藏:0      [点我收藏+]

今天遇到一个奇怪的现象,

假如html  body:

<div id="div1">

         <div id="div2"></div>

</div>

CSS:

#div1{

height:200px;

width:200px

}

#div2{

    position: absolute;
    margin: auto;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;

    height:200px;

    width:200px

}

按我原先的理解来说说应该div2在div1内上下左右都居中,而事实上却在body中居中,这让我困惑了好久。

后来发现将div1的 position设为relative才能达到原来预想的效果。

原因是绝对定位的盒子是相对于离它最近的一个已定位的盒子进行定位的(默认是body);要想相对父元素定位,父元素必须设置相对定位(relative)。

关于div内部绝对定位的div,位置并不根据父元素的来定位的笔记

原文:https://www.cnblogs.com/hjc-12580/p/11454622.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!