안녕하세요

Xe로 레이아웃 적용한 게시판을 만들어서

layout.css 파일을 수정했습니다.

============================  layout.html 일부내용  =================================
    <div class="contentBox">
        <div class="topBg"></div>
        <div class="centerBg">
            <div class="contentArea">
                {$content}
                <div class="clear"></div>
            </div>
        </div>
        <div class="bottomBg"></div>
==============================================================================

============================  layout.css 일부내용  =================================

#blog {margin:0 auto; width:780px;}

#content { width:500px; }

/* Global Navigation */
.blogNavigation {overflow:hidden; width:680px;color:blue;}

ul.blogGlobal {padding:0; margin:0; list-style:none; overflow:hidden; float:right; margin:10px 0 10px 0; }
ul.blogGlobal li {float:left; margin-left:-1px; padding:0 .6em;}
ul.blogGlobal li a {text-decoration:none; font-size:.9em; letter-spacing:-1px;}

ul.blogMenu {padding:0; list-style:none; overflow:hidden; float:right; margin:0 0 10px 0; }
ul.blogMenu li {float:left; margin-left:-1px; padding:0 .8em;}
ul.blogMenu li a {text-decoration:none; font:bold .9em tahoma;}
ul.blogMenu li a.on {}

/* Content Box */
.contentBox { float:left; width:780px;}              <==         .contentBox { float:left; width:680px;}  로 수정
.contentBox .centerBg {padding-top:1em;}
.contentBox .topBg {width:100%; height:10px; font-size:0;}
.contentBox .bottomBg {width:100%; height:10px; font-size:0;}
.contentArea {width:740px; margin:0 auto;}          <==       .contentArea {width:640px; margin:0 auto;} 로 수정

===========================================================================

게시판에 가에 테두리가 있습니다

게시판 사이즈도 줄이고 가쪽에 테두리로 같이 줄이려고

소스 수정을 했는데

테두리 사이즈가 780 이상이면 780 크기 그대로 변화 없고

780 이하로 수정하면 오른쪽 끝쪽의 라운드 부분이 짤려서 출력이 됩니다

왜 780px 로만 제대로 출력 되는지 도대체 알수가 없습니다.

어떻게 수정을 해야 하나요?

좀 도와 주세요..ㅠㅜ

첨부파일 참조

1.gif 는 780px 로 했을때 제대로 출력되는화면

2.gif 는 680px 로 했을때 오른쪽 끝이 깨지는 화면