묻고답하기
레이아웃 CSS 에서요.. IE6.0에서 밀림현상
2010.03.25 09:45
left | center | right 에서 IE6.0 에서는 right 부분이 자꾸 아래쪽으로 내려갑니다..
즉, left | center |
right
이렇게 보이는데요... 레이아웃파일에서 html 파일과 CSS를 봐도 왜그런지 잘 모르겠네요..
* CSS에서 보면
#contentWrap {position:relative; overflow:hidden; width:980px; margin:0; padding:0; background:#ffffff;}
#contentWrap .left {float:left; width:200px; padding:5px 0 0;}
#contentWrap .center {float:left; width:580px; padding:5px 10px; overflow:hidden;}
#contentWrap .right {float:left; padding:5px 0 0; width:180px;}
이구요..
* 레이아웃 부분..
<div id="contentWrap">
<div class="left">
<!--
왼쪽 사이드바 시작 - 가로 사이즈 : 200px
위젯 및 html 코드를 넣으시면 됩니다.
위젯 코드 아래에 <img src="./images/blank.gif" alt="mask" class="maskL">를 삽입 하시길 권장합니다.
-->
<!-- 왼쪽 메뉴 시작 (2차 부터)-->
<!--@foreach($main_menu->list as $key => $val)-->
<!--@if($val['selected'])-->{@ $menu_1st_ = $val }<!--@end-->
<!--@end-->
<!--@if($menu_1st_['list'])-->
<ol id="lnb">
<!-- 2차 시작 -->
<!--@foreach($menu_1st_['list'] as $key => $val)--><!--@if($val['link'])-->
{@ $menu_2nd_ = $val }
<li <!--@if($val['selected'])-->class="on"<!--@end-->><p><img src="./images/mpage.gif" alt="page"/><a href="{$val['href']}" <!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@if($menu_2nd_['list'] && ($menu_2nd_['expand']=='Y'||$menu_2nd_['selected']) )-->
<ul>
{@ $count1 = 0}
<!--@foreach($menu_2nd_['list'] as $key => $val)--><!--@if($val['link'])-->
{@ $count1++ }
{@ $menu_3rd_ = $val }
<li <!--@if($val['selected'])-->class="on"<!--@end-->><p><!--@if($count1 == count($menu_2nd_['list']))--><img src="./images/mjoinbottom.gif" alt="└"/>{@ $line1 = "end"}<!--@else--><img src="./images/mjoin.gif" alt="├"/><!--@end--><img src="./images/mpage.gif" alt="page"/><a href="{$val['href']}" <!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@if($menu_3rd_['list'] && ($menu_3rd_['expand']=='Y'||$menu_3rd_['selected']) )-->
<ul>
{@ $count2 = 0}
<!--@foreach($menu_3rd_['list'] as $key => $val)--><!--@if($val['link'])-->
{@ $count2++ }
{@ $menu_4th_ = $val }
<li <!--@if($val['selected'])-->class="on"<!--@end-->><p><!--@if($line1 != "end")--><img src="./images/mline.gif" alt="│"/><!--@else--><img src="./images/blank.gif" width="18" height="18" alt=" "/><!--@end--><!--@if($count2 == count($menu_3rd_['list']))--><img src="./images/mjoinbottom.gif" alt="└"/>{@ $line2 = "end"}<!--@else--><img src="./images/mjoin.gif" alt="├"/><!--@end--><img src="./images/mpage.gif" alt="page"/><a href="{$val['href']}" <!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@if($menu_4th_['list'] && ($menu_4th_['expand']=='Y'||$menu_4th_['+
'+
'selected']) )-->
<ul>
{@ $count3 = 0}
<!--@foreach($menu_4th_['list'] as $key => $val)--><!--@if($val['link'])-->
{@ $count3++ }
{@ $menu_5th_ = $val }
<li <!--@if($val['selected'])-->class="on"<!--@end-->><p><!--@if($line1 != "end")--><img src="./images/mline.gif" alt="│"/><!--@else--><img src="./images/blank.gif" width="18" height="18" alt=" "/><!--@end--><!--@if($line2 != "end")--><img src="./images/mline.gif" alt="│"/><!--@else--><img src="./images/blank.gif" width="18" height="18" alt=" "/><!--@end--><!--@if($count3 == count($menu_4th_['list']))--><img src="./images/mjoinbottom.gif" alt="└"/>{@ $line3 = "end"}<!--@else--><img src="./images/mjoin.gif" alt="├"/><!--@end--><img src="./images/mpage.gif" alt="page"/><a href="{$val['href']}" <!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@if($menu_5th_['list'] && ($menu_5th_['expand']=='Y'||$menu_5th_['selected']) )-->
<ul>
{@ $count4 = 0}
<!--@foreach($menu_5th_['list'] as $key => $val)--><!--@if($val['link'])-->
{@ $count4++ }
<li <!--@if($val['selected'])-->class="on"<!--@end-->><p><!--@if($line1 != "end")--><img src="./images/mline.gif" alt="│"/><!--@else--><img src="./images/blank.gif" width="18" height="18" alt=" "/><!--@end--><!--@if($line2 != "end")--><img src="./images/mline.gif" alt="│"/><!--@else--><img src="./images/blank.gif" width="18" height="18" alt=" "/><!--@end--><!--@if($line3 != "end")--><img src="./images/mline.gif" alt="│"/><!--@else--><img src="./images/blank.gif" width="18" height="18" alt=" "/><!--@end--><!--@if($count4 == count($menu_5th_['list']))--><img src="./images/mjoinbottom.gif" alt="└"/><!--@else--><img src="./images/mjoin.gif" alt="├"/><!--@end--><img src="./images/mpage.gif" alt="page"/><a href="{$val['href']}" <!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<
넓이 확인하세요. float 된 박스의 경우 넓이가 넘어가면 다음줄로 나오게되고 ie6는 float 시에 마진이 바뀌던가? 하는 버그가 있습니다.