Javascript 相对边缘内的绝对位置

是否可以将绝对位置div居中于相对俯冲范围内且边距为0自动

HTML:

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

.outer{
  background: red;
  margin: 0 auto;
  width:100px;
  height:100px;
}

.inner{
  position:absolute;
  width:20px;
  height:20px;
  background:blue;
  top:10px;
  left:10px;
}

我希望绝对定位能在外部的范围内工作，好吧，但我猜是边缘。上面的代码可以在这里看到：

理想情况下，我希望使用css来解决这个问题，但我认为更有可能使用js解决方案

非常感谢您的任何想法

C

新小提琴：

只需将

位置：相对

添加到

。外部

---

原因是因为默认的

位置

属性是

静态

，因为您希望它居中，所以在这里它也可以水平和垂直居中。放置

位置：绝对位置内部<代码>位置：相对允许它位于其中


可能的重复为什么这样更好？请解释。：）因为它也是垂直和水平居中的！把它放在你的答案里，巴德。解释一下。“教一个人钓鱼……”
.outer{
    background: red;
    margin: 0 auto;
    width:100px;
    height:100px;
    position:relative;
}

.inner{
    position:absolute;
    width:20px;
    height:20px;
    background:blue;
    top:0;
    margin: auto;
    left:0;
    right:0px;
    bottom:0;
}