CSS:设置宽度div以匹配屏幕边缘

Question

我有一个位置：绝对div元素，其位置仅在运行时知道，我希望它保持其左位置，但延伸到屏幕边缘。换句话说，我想将DIV的宽度设置为屏幕宽度，减去"左"的值：

.mydiv {
   position: absolute;
   width: calc(100% - left);
}

以上试图访问"左"的值未能成功。

当我将"右"设置为零时，狭窄的div被移动到右屏幕边缘，但不能将其保持左侧位置，否则它将：

.mydiv {
   position: absolute;
   right: 0;
}

我想保持"左"位置，并将div扩展到右屏幕边缘。

有办法做到吗？

Answer 1

不设置它的宽度！

如果DIV的父母说body ...只需添加：

right: 0;

示例：

/*QuickReset*/*{margin:0;box-sizing:border-box;}
.mydiv {
  position: absolute;
  right: 0; /* tyadaa! */
  height: 20px;
}
#one {
  left: 78px; /* or unknown */
  background: red;
  top: 50px;
}
#two {
  left: 26%; /* or unknown */
  background: blue;
  top: 90px;
}

<div id="one" class="mydiv"></div>
<div id="two" class="mydiv"></div>