HTML、CSS 将 div 放在相对元素的左侧而不是右侧

Question

我有这段代码:

#wrap {
  position: relative;
  width: auto;
  background: silver;
  border: 1px solid grey;
}

#text {
  position: absolute;
  width: 25%;
  right: 0;
  top: 0;
  bottom: 0;
  background: black;
  opacity: 0.5;
  filter: alpha(opacity=50);
}

<div>
  <div id="wrap">
    <img class="fit-img" src="~/Content/img/Assets/image.jpg">
    <div id="text"></div>
  </div>
</div>

我需要将 ID 为 text 的 DIV 放在左侧，而不是包装内容的右侧。有什么建议吗？

Answer 1

只需删除 right: 0; 并将其替换为 left: 0; :

#text {
  position: absolute;
  width: 25%;
  left: 0;
  top: 0;
  bottom: 0;
  background: black;
  opacity: 0.5;
  filter: alpha(opacity=50);
}