묻고답하기

XE의 경우
전체 본문의 길이가  980px
Content에 해당하는 오른쪽 컬럼이 770px로 고정되어있습니다.

와이드 모니터를 사용하면 상당히 많은 부분을 쓸모없이 버리게 되고 또한 큰 이미지를 사용할 일이 많아서 가능하면 자동으로 조절이 되도록 하려고 합니다.

#BodyWrap을 99%로 맞추고
ContentBody도 99%
columnRight 를 margin:0px auto; 로설정을 하면 IE 6 에서는 문제가 없습니다.
IE7 에서는 일부 페이지는 최근 게시물 리스트가 왼쪽메뉴보다 아래로 밀리고 일부는 또 괜찮더군요.
하지만 파폭은 왼쪽 메뉴보다 아랫쪽으로 본문이 위치 하게됩다.

[ IE6]
----------------------------------------------------
상단메뉴
----------------------------------------------------
왼 |   최근문서 위젯  |  최근문서 위젯
쪽 |      
메 |   최근문서 위젯  |  최근문서 위젯
뉴 |
--------------------------------------------------------
푸터
---------------------------------------------------------

[IE 7]
---------------------------------------------------------
상단메뉴
--------------------------------------------------------
왼 |   최근문서 위젯  |
쪽 | 
메 |   최근문서 위젯   |
뉴 |
     |                                  |   최근문서 위젯
     |
     |                                  |    최근문서 위젯
-------------------------------------------------------
푸터
--------------------------------------------------------


[FF]
-------------------------------------------------------
상단메뉴
-------------------------------------------------------
왼 |
쪽 |
메 |
뉴 |
----------------------------------------------------------
최근문서 위젯             |   최근문서 위젯

최근문서 위젯             |   최근문서 위젯
----------------------------------------------------------
푸터
----------------------------------------------------------


이렇게 나와 버립니다.
#columnRight { width:770px; float:right; overflow:hidden;}

#columnRight { margin:0px auto;  float:right; overflow:hidden;}

이렇게 바꾼겁니다.

IE 6기준으로는 쉽게 적용이 가능한데
IE 7과 FF까지 모두 호환되도록 설정하려니 죽겠네요.

브라우저의 창 크기를 조절했을때 본문의 크기가 같이 유동적으로 조절되는게 목적입니다.
긴 문서를 볼때도 770px의 좁은 공간에서 문서를 보는 것보다는 1600px의 넓은 영역을 다 활용하는게 더 좋을 테니까요.


고수 분들의 조언 부탁드립니다.