'XE 게시판 기본스킨'에 기본형태를 '갤러리'로 해서 게시판을 생성했습니다.

아래와 같이 웹사이트 가로 길이가 900px 이고요, 썸네일 4개를 가로로 출력해서 웹사이트 가로 길이와 딱 맞추고자 합니다. 

|------------------------------------------------------- 900-------------------------------------------------------|

|-------- 200 ---------|----|-------- 200 ---------|----|-------- 200 ---------|----|-------- 200 ---------|

근데, 썸네일 가로길이를 200으로 했더니, 아래와 같이... 

|------------------------------------------------------- 900 -------------------------------------------------------|

|-------- 200 ---------|----|-------- 200 ---------|----|-------- 200 ---------|----|

|-------- 200 ---------|

|------------------------------------------------------- 900 -------------------------------------------------------|

|---|------- 178 --------|----|------- 178 --------|----|------- 178 --------|----|------- 178 --------|---|

common.css 코드에 썸네일 부분을 아무리 고쳐도 안되길래 도움을 청합니다. 

아래가 썸네일 부분의 현재 코드고요... 그 파일의 다른 부분들은 전혀 건드리지 않았습니다.

어디를 어떻게 고쳐야 할까요?  도움 감사드립니다. 

.thumbnailBox { margin-top:1em; clear:both; overflow:hidden; padding: 0 0 0 0px; margin: 0 0 0 0px; border-bottom:1px solid #e0e1db; }

.thumbnailBox div.cell { display:block; float:left; overflow:hidden; margin-bottom:0px; margin-left:auto; margin-right:auto;}

.thumbnailBox div.cell img.thumb { padding: 0 0 0 0px; border:1px solid #67544e; display:block; margin-bottom:1em; margin-left:auto; margin-right:auto;}

.thumbnailBox div.cell img.thumb:hover { padding:0px; border:1px solid #c2d500; display:block; margin-bottom:1em; margin-left:auto; margin-right:auto;}

.thumbnailBox div.title { color:#67544e; margin-bottom:.2em; overflow:hidden; white-space:nowrap; text-align:center;}

.thumbnailBox div.title a { color:#67544e; text-decoration:none;}

.thumbnailBox div.title a:link { color:#67544e; text-decoration:none;}

.thumbnailBox div.title a:visited { color:#67544e; text-decoration:none;}

.thumbnailBox div.title a:hover { color:#c2d500; text-decoration:none;}

.thumbnailBox div.title a:active { color:#c2d500; text-decoration:none;}