html - 子 DIV 的 CSS 水平对齐方式

Question

我需要使子 DIV 本身右对齐或其中的 SPAN 右对齐。我希望以下代码适用于此。我错过了什么？它仍然是左对齐的。

出于某种原因，CSS 似乎没有“水平对齐”属性(大量疏忽？)。所以我决定尝试将 span 设置为全宽并右对齐文本以达到相同的效果。

<div id="something" style="width: 600px">
  <div id="somethingElse">
    <span style="width: 100%; text-align: end;">My Text</span>
  </div>
</div>

Answer 1

span 是内联的，对齐方式不起作用，因为它只会根据内容宽度自行调整。如果您需要保留 span 元素，则对父元素使用 text-align: end 或将其替换为 div。

#somethingElse {
  text-align: end;
}

<div id="something" style="width: 600px">
  <div id="somethingElse">
    <span>My Text</span>
  </div>
</div>