html + css 文字左右对齐

Question

如下图中红框中的文字, 字数不同时有什么好的方式实现这种左右对齐

Answer 1

楼上的text-align-last有兼容性问题，可以用下面这样

html

<div class="justify">汪 星 人</div>
<div class="justify">那 美 克 星 人</div>
<div class="justify">地 球 男 人</div>

css

  .justify {
    text-align: justify;
    width: 200px;
    border: 1px solid blue;
    height: 18px;
  }

  .justify::after {
    content: "";
    display: inline-block;
    width: 100%;
  }