Las Line的路线不合适

Question

selected div的最后一行的对齐是不适当的。它的文本对齐属性的值是对齐的，但是最后一行有一个问题。这就像是左派，而不是正当性的。其他线路没有任何问题。我该如何解决这个问题？

​

* {
  margin: 0;
  padding: 0;
}

body {
  background: #000;
  text-align: center;
  color: rgb(231, 231, 231);
}

#wrapper {
  width: 60%;
  margin: 0 auto;
}

#hello {
  padding: 50px;
  border-bottom: 3px double rgb(185, 185, 185);
}

#avatar {
  border-radius: 50%;
  width: 130px;
  height: auto;
  margin-bottom: 15px;
}

#hello-header {
  margin-bottom: 15px;
  font-size: 45px;
}

#header-p {
  font-size: 36px;
}

.link {
  text-decoration: none;
  color: rgb(241, 225, 1);
}

.link:hover {
  color: gray;
  transition: 0.2s;
}

#selected-works {
  width: 100%;
  margin: 50px 0;
  padding-bottom: 50px;
  text-align: justify;
  border-bottom: 1px solid gray;
}

#sw-header {
  margin-bottom: 35px;
  text-align: center;
}

.work {
  width: 32%;
  display: inline-block;
  text-align: left;
}

.work img {
  width: 100%;
  height: auto;
}

.work img:hover {
  opacity: .5;
  transition: opacity .3s linear;
}

<div id="wrapper">
  <div id="hello">
    <img id="avatar" src="https://jonchretien.com/img/avatar.jpg">
    <h2 id="hello-header">Hello</h2>
    <p id="header-p">
      My name is Jon Chretien. I’m a <a class="link" href="https://en.wikipedia.org/wiki/New_York_City">NYC</a> based front end engineer currently working on web apps for artists at <a class="link" href="https://www.spotify.com/">Spotify</a>. I previously
      built editorial & marketing projects at <a class="link" href="https://www.nytimes.com/">The New York Times</a>.
    </p>
  </div>
  <div id="selected-works">
    <h1 id="sw-header">Selected Works</h1>
    <div class="work">
      <a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists"><img src="https://jonchretien.com/img/work_s4a.jpg"></a>
      <h2><a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists">Spotify for Artists</a></h2>
      <p>Fan insights for artists & managers to discover more about their audience.</p>
    </div>
    <div class="work">
      <a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists"><img src="https://jonchretien.com/img/work_s4a.jpg"></a>
      <h2><a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists">Spotify for Artists</a></h2>
      <p>Fan insights for artists & managers to discover more about their audience.</p>
    </div>
    <div class="work">
      <a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists"><img src="https://jonchretien.com/img/work_s4a.jpg"></a>
      <h2><a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists">Spotify for Artists</a></h2>
      <p>Fan insights for artists & managers to discover more about their audience.</p>
    </div>
    <div class="work">
      <a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists"><img src="https://jonchretien.com/img/work_s4a.jpg"></a>
      <h2><a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists">Spotify for Artists</a></h2>
      <p>Fan insights for artists & managers to discover more about their audience.</p>
    </div>
    <div class="work">
      <a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists"><img src="https://jonchretien.com/img/work_s4a.jpg"></a>
      <h2><a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists">Spotify for Artists</a></h2>
      <p>Fan insights for artists & managers to discover more about their audience.</p>
    </div>
    <div class="work">
      <a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists"><img src="https://jonchretien.com/img/work_s4a.jpg"></a>
      <h2><a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists">Spotify for Artists</a></h2>
      <p>Fan insights for artists & managers to discover more about their audience.</p>
    </div>
    <div class="work">
      <a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists"><img src="https://jonchretien.com/img/work_s4a.jpg"></a>
      <h2><a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists">Spotify for Artists</a></h2>
      <p>Fan insights for artists & managers to discover more about their audience.</p>
    </div>
    <div class="work">
      <a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists"><img src="https://jonchretien.com/img/work_s4a.jpg"></a>
      <h2><a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists">Spotify for Artists</a></h2>
      <p>Fan insights for artists & managers to discover more about their audience.</p>
    </div>
    <div class="work">
      <a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists"><img src="https://jonchretien.com/img/work_s4a.jpg"></a>
      <h2><a class="link" href="https://artists.spotify.com/blog/fan-insights-is-now-spotify-for-artists">Spotify for Artists</a></h2>
      <p>Fan insights for artists & managers to discover more about their audience.</p>
    </div>
  </div>
</div>

​

selected div的最后一行的对齐是不适当的。它的文本对齐属性的值是对齐的，但是最后一行有一个问题。这就像是左派，而不是正当性的。其他线路没有任何问题。我该如何解决这个问题？

Answer 1

默认情况下，

text-align: justify;

所有的行都是合理的，除了最后一行。如果还希望最后一行是对齐的，则必须使用文本-对齐-最后

text-align-last: justify;

注意：这个属性是CSS文本模块3的一部分，当前浏览器支持位于77.98%。要在旧版本的浏览器中添加对它的支持，需要使用多填充。