블로그 본문에서 테이블이 HTML모드로 작성한대로 나오지(보이지) 않을 때

 
블로그에서 HTML모드로 테이블을 그려넣을 경우
저장하고 난 뒤에 보면 HTML에서 지정한 컬러나 보더(외곽선)가
적용되지 않는 경우가 있습니다.
 
HTML모드로 열심히 테이블을 만들었는데
글을 작성하는 입력모드에서는 정상적으로 보이다가
저장해서 블로그 메인창에서 완성된 글을 보면
테이블의 색이나 선(border)이 의도한 대로 나오지 않는 경우
HTML 모드에서 뻘짓한 것 아닌가 하는 좌절감이 몰려오더군요.

티스토리의 경우,
테이블의 칸(TD)색이나 선(border)이 의도한 대로(HTML 모드에서 코딩한 대로) 나오지 않을 때에는
스킨에서 기본적으로 제공되는 스타일시트를 점검해 보시기 바랍니다.
스타일시트에 본문 테이블에 대한 스타일이 이미 지정되어 있는 상태라면
아무리 본문에서 멋지게 테이블을 만들어도
스타일시트에서 지정된 내용이 우선적으로 적용되어
의도한 테이블의 모습으로 되지 않을 가능성이 높습니다.


이럴 경우
1. 관리자 모드로 
2. 스킨 > 'HTML/CSS 편집'을 클릭.
3. CSS에서 본문의 table관련 설정내용을 찾는다.
4. 설정이 필요없는 부분은 삭제하고, 필요한 부분은 추가한다.
5. 작성한 테이블이 의도한대로 보이는지 확인한다.
6. 테이블이 의도한 바대로 보일 때까지 설정을 수정한다.
7. 결국 의도한대로 테이블이 보인다.

style.css에서 본문 테이블관련 설정이 있는 부분

위 그림은 저의 경우인데요,
style.css 앞부분에 /* 포스트 본문 마크업 */ 이라고 주석달린 곳이 있고,
그 조금 아랫부분에
.article table th { ......  }
.article table td { ......  }
이렇게 테이블관련 설정이 있더군요.

.article table td {padding:2px; background-color:#ccc; }
이런식으로 테이블 칸(td)에 색 설정이 되어 있어
본문 작성하면서 HTML로 색을 아무리 지정해봤자 소용이 없었고
선(border) 역시 나타나지 않았습니다.
테이블 칸의 색상을 지정한 'background-color:#ccc;'를 삭제하고
보더에 대한 설정(border-collapse:collapse; border:1px solid #cccccc;)을 추가하니
그제서야 테이블의 칸(td)이 본문 HTML에서 지정한 색으로 나타나고
줄(border)도 그어지더군요^^;; 

저처럼 테이블이 지정한대로 보이지 않아
본문 입력창의 HTML 모드에서 벗어나지 못한 채 그 원인을 찾기 위해
밤을 지새우는 일이 없으시길 바랍니다^^;;.* (posted by 훈샘 :  http://brandesign.tistory.com )

---

조금이나마 흥미 있으셨거나, 가치를 느끼셨거나, 도움이 되셨다면
아래 'view on'과 'mixup' 클릭하는 센스^^