极客观点
项目管理
HarmonyOS
以前没注意，最近遇到了一个不能理解的问题，父元素是relative然后宽度固定，子元素没有宽度内有文字绝对定位，当left值大于父元素宽度的时候，文字居然竖着排列了，但是当right值为负的时候又是横着排列的，代码如下：
<style type="text/css">
.box{
position: relative;
width:400px;
height:500px;
background-color: #0e90d2;
}
.ab{
position: absolute;
left:400px;
}
</style>
<body>
<div class="row">
<div class="box" id="box">
<div class="ab">我是绝对定位</div>
</div>
</div>
</body>一开始我以为是和浮动类似脱离文档流文字环绕的效果，但是为什么right为负的时候如-100px，为什么没有竖着排列
这里的宽度是由绝对定位元素ab(以下简称ab)的left和right，以及ab的包含块box的宽度决定的。
也就是说在
ab.left和ab.right同时被定义时,box.width - ab.left - ab.right其实是ab.width的最大值，因为ab的left和right属性其实是扩展了box的容纳宽度。此外ab的宽度还遵循根据自身内容自动增加的规则，所以在宽度足够时会自动增加，不足时就为单字宽度，甚至在
ab.left和ab.right同时被定义时可以达到宽度为0。如果想用right模拟类似效果，应该是使用
right:400px;。