div 로 레이아웃을 구성할때 왼쪽에 메뉴를 넣고 오른쪽에 본문을 넣는 경우가 많다.
그런데 만약 오른쪽에 표시되는 본문 div 의크기를 가변적으로 하고싶다면 어떻게 해야할까?
이것을 해결하기위해 여러가지 테스트를 해 보았다.
먼저 기본적으로 본문의 너비를 400px 로 한 레이아웃은 아래와 같다.
가장 먼저 생각한것은 main 의 너비를 100% 로 하는것인데 이렇게 하면 아래와같이 된다.
이건 아니다.
다음으로는 left 의 position 을 absolute 로 설정하고 main 의 margin-left 를 left 의 크기만큼 주는것이다.
이것역시 위처럼 left 의 크기만큼 오른쪽으로 삐져나가는 현상이 발생했다.
결국 아직 답을찾지 못했다.
어떤 방법이 있을까?
left에 float:left 주시고 main에는 그냥 width:100%;
http://hey4you.net:8080/down/ex.zip
마조리카 오랜만이군.ㅋ
그런데 저 소스에 있는것처럼 본문의 너비를 900px 으로 정해놨다면 뭐 그리 문제될것이 없는데 여기서 원한건 본문의 너비가 정해져있지 않았을때 였어.
즉 브라우저가 늘어나면 늘어나고 줄어들면 줄어들게 만들어야 한다 이거지..
제일 상위인 content에 witdh:100%주면 브라우저 사이즈에 종속이자나요. @_@;
게다가 main은 100%라서 딱히..;; 내용이 아무리 커도 어차피 top 크기는 안벗어나야지 않아요?
익스 8.0 에서 확인해 보니까 되네.
근데 7.0 에서는 안되는구만.....ㅋㅋ
아마 버젼업 되면서 수정된거 같아.
여튼 익스건 파폭이건 이젠 잘되네.ㅋ
