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

2행중 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;
}

3점 지도자는 끝이 아니라 중앙에 왔다.
끝까지 남고 싶어요.

확인된 브라우저

1
2
Android 4.0 Chrome
iPhone6 iOS10.2 Safari

요컨대 처리하다

HTML은 그대로 안에 있는 a 라벨에line-clamp을 붙이면 끝입니다!
하지만 사파리만...크롬 안돼.

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)

크롬도 했는데 빌려서 못 잡았어...

는 라벨입니까 아니면 다른 이유입니까?도대체 어떤 스타일이냐면...알고 싶어요...