[CSS] 긴 URL/긴 문자의 줄바꿈

Long URL

위의 그림과 같이 긴 URL이나 긴 문자가 컨텐츠 영역을 벗어나 표시되는 경우가 있습니다. 이 경우 CSS를 통해 컨텐츠 영역 끝에 도달하면 줄바꿈하도록 처리할 수 있습니다.

다음과 같은 CSS 코드를 사용하면 됩니다.

.entry-summary {
word-wrap: break-word;
}

위에서 요소명은 적절히 수정하도록 합니다. 그러면 다음과 같이 긴 URL이 영역을 벗어나지 않고 줄바꿈이 됩니다.
긴 URL 줄바꿈

위의 CSS 코드가 잘 작동하지 않으면 다음과 같은 코드를 시도해보시기 바랍니다.

overflow-wrap: break-word;
word-wrap: break-word;

overflow가 될 때 컨텐츠를 숨기고 말줄임표()로 대체하려면 다음을 사용하면 됩니다.

overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;

떠나시기 전에 아무 댓글(Comments)이라도 남겨두세요.
기부를 통해 이 블로그의 운영을 후원하실 수 있습니다.