极客观点
项目管理
HarmonyOS
在一段样式代码中同时使用了left、right、top、bottom，但产生的效果比较费解，这是代码：
<!DOCTYPE html>
<html>
<head>
<title>document</title>
<style>
.container{
width:100px;
height:100px;
position:relative;
}
.inner-box{
background:#000;
left:0;
top:0;
bottom:0;
right:50%;
position:absolute;
}
</style>
</head>
<body>
<div class="container">
<div class="inner-box"></div>
</div>
</body>
</html>inner-box并没有定义宽度，但运行结果却产生了宽度(黑色部分)：
我发现这是由于代码中同时用了left、right、top、bottom造成的，请问为什么会这样呢？怎么正确理解它？
绝对定位的元素有这么一个计算公式。
以水平方向为例子。
left是0，margin默认是0，padding默认是0，right是50%，width默认是auto，所以最后算出来width是50%
可用来做垂直水平居中。
根据上面的公式，margin自动计算，所以
margin-top=margin-bottom均分剩余空间，就会居中。标准在这