html - 绝对定位不适用于宽度和左侧值

Question

我有一个具有绝对定位的 div，它又是绝对定位元素的子元素。设置 width:100%;left:1px;right:1px 给 child 不工作。我面临的问题是，它超出了父元素。

<div class="outer">
  <div class="inner">

  </div>
</div>
.outer{
    position:absolute;
    width:80px;height:80px;
  border:1px solid #d3d3d3;
 }
.inner{
   position:absolute;
   width:100%;
   height:100%;
   background:red;
   left:1px;right:1px;bottom:1px;top:1px
} 

引用here

Answer 1

只需去掉子元素上的 100%，内部 div 就会适合父元素。

.outer{
  position:absolute;
  width:80px;height:80px;
  border:1px solid #d3d3d3;
}
.inner{
  position:absolute;
  background:red;
  left:1px;right:1px;bottom:1px;top:1px
}