티스토리 이미지와 글 간격을 줄이려면?

티스토리 포스팅의 이미지와 글 사이의 간격을 줄이는 방법

포스팅을 하면서 이미지 파일을 즐겨 넣는 편인데, 이미지와 글 사이의 간격이 너무 넓어 가독성이 떨어진다고 느낀 적이 많았습니다.

 

제 글은 대부분 글 다음에 글에 해당하는 이미지가 따라 나오는 스타일인데, 글과 이미지 사이의 간격이 너무 넓으니 글과 이미지가 동떨어져 보이는 것이죠.

 

때문에 이미지 다음 글에는 일부러 엔터를 두어번 입력하여 강제로 간격을 떨어뜨리곤 했는데요, 영 불편해서 이미지 간격을 설정한 태그를 찾아서, 이미지와 글 사이의 간격을 아예 줄였습니다.

 

방법은 다음과 같습니다.

1. 티스토리 관리자에서 [HTML/CSS 편집] 항목을 클릭합니다.

2. CTRL+F 키를 눌러 검색창을 열고, 찾기 창에 imageb 를 입력합니다.

3. style.css에서 한군데만 검색됩니다. 여기서 'margin:' 항목 뒤의 숫자를 조절하면 됩니다. 저는 20픽셀로 설정되어 있던 것을 5픽셀로 줄였습니다.

티스토리 HTML/CSS 편집티스토리 HTML/CSS 편집

 

바꾼 결과는 다음과 같습니다.

왼쪽이 원래의 20픽셀일 때, 오른쪽이 5픽셀로 바꾼 후입니다.

전체적으로 글과 이미지 사이의 간격이 줄어들면서 원하던 느낌이 나오네요.

margin 조절 전/후margin 조절 전/후

 

이 글을 공유하기

댓글 :: 질문 댓글은 공개글로 달아주세요. 특별한 이유없는 비밀 댓글에는 답변하지 않습니다

Designed by JB FACTORY