고래 스킨 4.1 모바일에서 제목이 전부 나오게 하는 방법

고래스킨이나 다른 스킨도 마찬가지지만 모바일에서 간혹 가다 제목이 잘리는 경우가 있습니다.

이 경우 사용자가 보기 불편하게 될 수도 있는데요.

오늘은 고래스킨에서 어떻게 하면 모바일에서 제목이 잘리지 않는지 그 방법을 설명해 보겠습니다.

다른 스킨들도 원리는 동일하니 찾아서 한번 시도해 보세요.

모바일 티스토리에서 제목이 잘린 것을 보여주는 이미지입니다. — 모바일에서 잘린 제목

고래스킨 모바일에서 제목이 잘리지 않는 방법

어떤 스킨이든 눈에 보이는 것을 수정하려면 일단 CSS를 건드려야 한다는 개념을 아셔야 합니다.

이 개념만 이해하고 나시면 나중에 무언가 고칠 때도 찾는 것이 쉽습니다.

블로그 관리 -> 스킨 편집 -> html 편집에 들어가서 CSS 탭으로 들어가게 된다면 다음 사진과 같은 코드를 발견하실 수 있습니다.

고래스킨 4.1에서 포스팅 제목을 고치는 코드 사진입니다. — 포스팅의 제목 관련 코드

. list_detail_wrap과. post_title은 함수입니다.

이 함수의 이름과 행동은 눈에 보이지 않는 html에서 지정해 주는 것이고, CSS는 그 함수가 눈에 보이도록 크기나 모양을 결정해 주는 거라고 이해하시면 쉽습니다.

여기서 white-space는 줄 바꿈을 할 공간을 지정해 주는 것인데, 만약 현재 지금 제목이 잘리고 있는 상태라면 원래는 아래의 코드와 같이 norwap으로 되어있으실 겁니다.

.list_detail_wrap .post_title {
	margin-bottom: 5px;
	display: block;
	white-space: nowrap;
	text-overflow: ellipsis;
	max-width: 728px;
	overflow:hidden;
	color: #333;
	font-weight: 600;
	line-height: 140%;
	font-size: 17px;
}

norwrap의 뜻은 자동 줄 바꿈을 무시한다는 뜻이므로 이를 normal로 바꿔주게 되면 자동 줄 바꿈이 되게 됩니다.

그렇게 적용시키게 되면 아래와 같이 모바일에서도 제목이 잘리지 않는 걸 보실 수 있습니다.