테이블 px가 맞지 않는거 같습니다. ;;
관련링크
본문
div로 px 맞추가기 쉽지 않네요 ;;
위처럼 3개 줄로 나눴구요..
좌측에 250px 에 border 1을 주니 252px가 될것이고, 우측도 마찬가지이니 252px X2 = 504px가 될거 같은데요.
그리고 중간에 454px에 border 1을 주니 456px 그리고 중간에 공간을 5px의 공백을 주니 5px X2 = 10px
504px + 456px + 10px = 970px
그렇게 합하면 그누보드에서 기본적으로 설정되어 있는 970px 값이 될거 같은데요.
제대로 안먹고, border 1을 줬는데 깨지고 하네요 ;;
답변 3
일단 자식 오브젝트들부터 width 값 맞춰보세요.
자식들 크기가 다 뒤죽박죽이네요.
덧글 자세히 보니 #left_side .lt 의 크기좀 맞춰보세요. ^^
#left_side{float:left;width:252px;margin-right:5px}
#left_side .lt{border:1px solid #e4eaec;background:#ffffff;margin=bottom:5px}
#center{float:left;width:456px;margin-right:5px}
#right_side{float:left;width:252px;}
<div id="wrapper">
<!-- 왼쪽 페이지 -->
<div id="left_side">
<div class="lt">
최신글
</div>
<div class="lt">
최신글
</div>
<div class="lt">
최신글
</div>
</div>
<!-- 왼쪽 페이지 -->
<!-- 중간 페이지 -->
<div id="center">
<div class="lt">
최신글
</div>
<div class="lt">
최신글
</div>
<div class="lt">
최신글
</div>
</div>
<!-- 중간 페이지 끝 -->
<!-- 우측 페이지 -->
<div id="right_side">
<!-- 로그인 전 아웃로그인 시작 { -->
<section id="ol_before" class="ol">
로그인
</section>
</div>
<!-- 우측 페이지 끝-->
</div>
<div style="float:left;width:250px;border:1px solid #e4eaec;background:#ffffff;
로 되어 있는곳은 다 지우시고 #left_side 등에 직접 float 적용하세요
소스보기를 해보면
<!-- 왼쪽 페이지 --> | |
<div id="left_side"> | |
<div class="lt"> | |
<!-- 공지사항 최신글 시작 { --> | |
<div class="lt">
|
클래스명 lt가 최신글에 다 들어있는걸 보니 최신글 기본 스타일인듯하네요..
#left_side .lt{border:1px solid #e4eaec;background:#ffffff;margin=bottom:5px}를
클래스명을 다르게 해주시면 되겠죠
#left_side .box_wrap{border:1px solid #e4eaec;background:#ffffff;margin=bottom:5px}
<div id="wrapper">
<!-- 왼쪽 페이지 -->
<div id="left_side">
<div class="box_wrap">
최신글
</div>
이런식으로....