텍스트가 길면 ....처리를 하려고 하는데 도움 부탁드립니다.

달려라쫑이 4년 전 조회 3,644

아래 코드 처럼 css를 짜서 크롬이나 엣지에서는 정상적으로 3줄보다 길 경우에는 ...처리가 되어 출력이 되는데 익스플로러에서는 저 소스가 적용되지를 않아서 여쭤봅니다. 고수님들 다른방법이 있을까요? 도움 부탁드립니다. 익스플로 버전은 10입니다.

</p>

<p>font-size: 1.6rem;</p>

<p>font-weight: 300;  </p>

<p>width: 100%;</p>

<p>height: auto;</p>

<p>line-height: 1.45;</p>

<p>overflow: hidden;</p>

<p>text-overflow: ellipsis;</p>

<p>white-space: normal;</p>

<p>text-align: left;</p>

<p>word-wrap: break-word;</p>

<p>display: -webkit-box;</p>

<p>-webkit-line-clamp: 3;</p>

<p>-webkit-box-orient: vertical;</p>

<p>

#영카트5 #그누보드5 #css3 #text #텍스트

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

정렬:

에이비A

4년 전

가로를 % 말고 픽셀로 줘보시겠어요?

</span></span></p>

<p><span style="font-size:10pt;"><span style="font-family:맑은 고딕;"><code>.ellipsis { </code><code>width</code><code>: </code><code>150px</code><code>; text-</code><code>overflow</code><code>: ellipsis; </code><code>white-space</code><code>: </code><code>nowrap</code><code>; </code><code>overflow</code><code>: </code><code>hidden</code><code>; }</code></span></span></p>

<p><span style="font-size:10pt;"><span style="font-family:맑은 고딕;"><code>

보통 이렇게 하면 모든 브라우저에서 전부 적용되긴 합니다만..
가로 % 가 걸리네요.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인

텍스트가 길면 ....처리를 하려고 하는데 도움 부탁드립니다.

답변 1개

공유하기