[CSS] 여러 줄에서 3점 리더를 맡고 있는 라인클램프. 만약에 a탭이 있거나 a탭으로 지정된다면 3점 리더를 넣은 곳은 끝이 아니라 중앙인 것 같은데?

<div>
  <a href=""><img src="" alt=""></a>
  <h3 class="item-title">
    <a href="">名前が入ります</a>
  </h3>
</div>

div {
  width: 200px;
}
.item-title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

확인된 브라우저

요컨대 처리하다

div {
  width: 200px;
}
.item-title {
}
.item-title a {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

도대체 어떻게 된 거야

<div>
  <a href="">
    <img src="" alt="">
    <h3 class="item-title">
      名前が入ります
    </h3>
  </a>
</div>

div {
  width: 200px;
}
.item-title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

캡처 시도(Safari)