수다닷컴

!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
html xmlns=http://www.w3.org/1999/xhtml lang=ko xml:lang=ko
head
meta http-equiv=Content-Type content=text/html; charset=euc-kr /
title/title
style type=text/css
html,
body {
height: 100%;
margin: 0;
padding: 0;
}
#head {
height: 125px;
background: #ddd;
position: relative;
z-index: 1;
}
#body {
min-height: 100%;
margin: -125px 0 -120px; BACKGROUND: url(../image/body_bg.gif) repeat-y;
}
* html #body {
height: 100%;
}
#content-area-left {
width:50%;
padding: 125px 0 120px;
float:left;
}
#content-area-right {
width:50%;
padding: 125px 0 120px;
float:left;
}
#foot {
height: 120px;
background: #ddd;
}
/style
/head
body
div id=head
요건 100px 높이 헤드
/div
div id=body
div id=content-area-left
p좌측 컨텐츠 영역 1/p
p좌측 컨텐츠 영역 2/p
p좌측 컨텐츠 영역 3/p
p좌측 (계속 추가해서 테스트 가능)/p
/div
div id=content-area-right
p우측 컨텐츠 영역 1/p
p우측 컨텐츠 영역 2/p
p우측 컨텐츠 영역 3/p
p우측 (계속 추가해서 테스트 가능)/p
p우측 컨텐츠 영역 1/p
p우측 컨텐츠 영역 2/p
p우측 컨텐츠 영역 3/p
p우측 (계속 추가해서 테스트 가능)/p
p우측 컨텐츠 영역 1/p
p우측 컨텐츠 영역 2/p
p우측 컨텐츠 영역 3/p
/div
/div
div id=foot
요건 50px 높이 풋
/div
/body
/html
우측 컨텐츠 영역 부분을 좀 적당히 넣었을땐 전혀 문제가 없더니
내용이 보이는 익스플로러 화면을 벗어나면 엉망이 됩니다.
근데 더 황당한건 ie8만 그런다는 겁니다.
ie6,7은 전혀 문제 없는데..

컨텐츠 부분을 왼쪽 오른쪽으로 나누는 부분에서 문제가 발생하는것 까지는 알겠는데
그렇다고 안나눌수도 없고

#content-area-right {
width:50%;
padding: 125px 0 120px;
float:left;
}

여기서 float:left;를 없애면 문제없이 늘어나는데 대신 오른족 왼쪽이 엉망이 되니까..
해결방법이 있을까요?

신청하기