자바 스크립트를 이래저래 쓰면 우측에 특정 레이어와 좌측의 레이어 높이를 통일시키겠지만...

레이아웃에 자바스크립트를 복잡하게 해두면 왠지 깔끔하지 못하죠..;;;

저 같은 경우에 어떻게 해결했냐면요.

(설명을 말로하자니 너무 복잡해서 소스로 적어볼게요.)

<!-- layout.html 파일 -->

<div id="contentBody">

  <div class="LeftSide"> <!-- 왼쪽 사이드 쪽 레이어입니다. -->

  왼쪽 사이드 내용

  </div>

  <div class="RightBody"> <!-- 오른쪽 본문 부분 레이어이죠... -->

   오른쪽 본문내용

  </div>

</div>

<!-- layout.html 파일 끝 -->

<!-- default.css CSS파일 시작 -->

....생략

body { margin:0; padding:0; background-color:#ffffff; }

#contentBody { width:870px; margin:0 auto 0 auto; background:url(../images/default/leftside_bg.gif) repeat-y left; }

#contentBody .LeftSide { float:left; width:170px; margin-right:20px; }

#contentBody. RightBody { float:right; width:680px; }

....생략

<!-- default.css CSS파일 소스끝 -->

뭐 대충 이런식으로 짜서했는데요. 위에 CSS 소스보시면 #contentBody 레이어 부분에 배경이미지를 세로로 반복되게 주었죠.

오른쪽의 본문내용이 높이가 커지든.. 왼쪽에 사이드가 높이가 더 커지든간에 가장 높은 레이어에 만큼

두 레이어를 포함하고 있는 #contentBody의 높이가 늘어나면서 그에 맞게 배경이미지도 적용됩니다.

이때 왼쪽 사이드 부분 폭넓이가 170px 라고 선언했죠.

그래서 저는 배경이미지 가로폭을 170px 로 하고 세로는 1px 로 해서 세로로 반복배경 되도록 처리 한거구요.

내용이 좀 복잡한거 같은데 이해가 가실런지 .... 몇번 읽어보면 무슨 말인지 이해 갈거에요.

솔직히 이런 방법 말고는 복잡하디 복잡한 자바스크립트로 도배를 해야해서 ㅎㅎㅎ

고작 요만한 글 적는데 시간이 이만큼이나 흘렀네 헉....