来自 CSS 10.2;
指定百分比宽度。百分比是根据生成的框的包含块的宽度计算的。如果包含块的宽度取决于此元素的宽度，则生成的布局在 CSS 2.1 中未定义。注： 对于包含块的绝对定位元素，其包含块基于块容器元素，将根据该元素的填充框的宽度计算百分比。这是与 CSS1 的更改，在 CSS1 中，百分比宽度始终相对于父元素的内容框进行计算。
我觉得很奇怪，根据元素是否绝对定位，百分比的计算方式不同。然而，我对CSS很陌生，所以我猜这是有充分理由的。但是，有没有办法在不更改子元素中的position: absolute的情况下返回相对于包含块而不是填充的宽度计算？目前，我width:100%了一个绝对定位的子元素，这个细微差别让我的布局绊倒了我，与这个jsfiddle演示非常相似：
是不可能的，但你可以做一个小技巧，删除width:100%添加right:0并left:200px→父项填充的值：
*{
border: 2px solid red;
}
html {
height: 50%;
border: 2px dashed yellow;
}
body {
margin: 60px;
height: 100%;
width: 50%;
padding-left: 200px;
position:relative;
background: #000;
color: #aaa;
}
.region{
position: absolute;
top: 0;
left:200px;
right:0;
border: 2px dashed white;
}<body>
<div class="region">hello</div>
</body>这是一个同时具有右填充和右边距的，请使用您需要的那个。
如果要填充region的父宽度，请将 right 设置为 0 (right: 0;)
*{
border: 2px solid red;
}
html {
height: 50%;
border: 2px dashed yellow;
}
body {
margin: 60px;
height: 100%;
width: 50%;
padding-right: 50px;
position:relative;
background: #666;
color: #aaa;
}
.region{
position: absolute;
top: 0;
left: 0;
right: 40px;
padding-right: 40px;
border: 2px dashed white;
text-align: right;
}<div class="region">hello</div>