border-bottom:1px solid #d9d9d9; 등 border 1px 씩 추가하게되면 div칸이 계속 망가지네요 아래와같이..

그래서 보더를 1px 증가시키면 width 나 height 를 1씩 줄여보는데 이거로는 해결이 안되는거같네요..

혹시 어떻게하면 해결이 될지 아시는분 답변 부탁드려요 *^^*

(소스는 가장 아래에 첨부해보도록 하겠습니다! ㅠㅠ 잠시만 시간을 내주시면 감사하겠습니다. __)

 

아래 사진과 같이 만드려고하는데 border 굵기를 추가하게되면 칸이 이탈을..ㅠ.ㅠ

css 소스(newmain.css)

/* container start */
#container {position:relative;width:100%;height:517px;margin:0 auto;top:-70px;}
#container #box {position:relative; width:988px; height:517px; border:1px solid #d9d9d9; margin:0 auto;}
#container #box #container_box1 {float:left;width:329px; height:258px; border-right:1px solid #d9d9d9;}

#container #box #container_box2 {float:left;width:328px; height:258px;}

 

#container #box #container_box3 {float:left;width:330px; height:258px;}

 

#container #box #container_box4 {float:left;width:329px; height:258px;}

#container #box #container_box5 {float:left;width:329px; height:258px;}

#container #box #container_box6 {float:left;width:330px; height:258px;}

 

 

html 파일 속의소스

 

  <link rel="stylesheet" href="newmain.css" />
     <div id="container">
      <div id="box">
            <div id="container_box1">1</div>
            <div id="container_box2">2</div>
            <div id="container_box3">3</div>
            <div id="container_box4">4</div>
            <div id="container_box5">5</div>
        <div id="container_box6">6</div>

    </div>
</div>