세로 100% 레이아웃 설계 중 문의사항.
얀별
제목이 너무 거창했는지 모르겠네요.
질문 내용은 어찌보면 단순한데. 다시 생각하면 복잡할 수도 있겠단 생각이 드네요.
질문 내용은 아래와 같습니다.
[질문 _ 01번]
웹디자인을 보면, 서브화면 중 좌측메뉴부분과 본문으로 나뉩니다.
그리고 아래로 하단 카피라이트 부분이 붙게 되구요.
그런데, 본문 디자인이 가장자리가 둥글게 처리된 테두리가 쳐져있을 경우에 대한 질문입니다.
위의 이미지를 보면, A, B, C, D, E 영역으로 나뉘어 있습니다.
이 때 B영역과 D영역이 C영역의 컨텐츠 세로 길이에 따라 자동으로 늘어나는 방법을 알고 싶습니다.
B와 D는 이미지로 repeat-y를 주어서 배경이 계속 유지되게 해야하구요.
혹시나 하여, 세로 100% 레이아웃인 min-height와 clear:both를 이용해서 해볼까 했는데... 맨위에서 언급했듯이,
이미 상위단계에서 사용을 하고 있습니다.
다시 말해, Top, Middle(Left, Contents), Bottom 에서 사용을 하고 있기 때문에,
위의 이미지는 Contents 부분입니다.
그렇기 때문에 어떻게 해야할지.. 설계를 어떻게 해야할지 구조가 머릿속에 그려지지가 않아서요.
소스작성해서 올려주실분 안계실까요?
세세하게는 아니더라도, 구성만 알수 있도록이요. 부탁드립니다.
-
글고운
* {margin:0px; padding:0px;}
.bd {border:1px solid red;}
#all {width:300px;}
#box_top {background:url(topbg.gif) no-repeat left top;height:10px;}
#box_body {background:url(bodybg.gif) repeat-y left top;padding-left:10px;padding-right:10px;text-align:cent