묻고답하기
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
메뉴란이 해상도에 따라 틀려지는 문제점 ..
2009.02.23 11:16
안녕하세요 ..
메인메뉴를 만들었는데요 .. 문제점이 하나 있어요 ..
개발할때 해상도는 1024*768로 했느데 .. 나중에 1280*1024로 하니까 ..
메뉴란이 원래 위치에서 왼쪽으로 넘어갔어요 ..
아래에 .. 해당 코드를 복사해 올려봤습니다.
혹시 원인 아시는분 있으시면 .. 좋은 답변 부탁 드립니다 ..
좋은 하루 되세요 .. ^^
layout.html 코드:
<div align="center" id="top">
<!-- 검색창 -->
<form action="{getUrl()}" method="post" id="isSearch">
<input type="hidden" name="mid" value="{$mid}" />
<input type="hidden" name="act" value="IS" />
<input type="hidden" name="search_target" value="title_content" />
<input name="is_keyword" type="text" class="inputText" title="keyword" />
<input type="image" src="./images/{$layout_info->colorset}/buttonSearch.gif" alt="{$lang->cmd_search}" class="submit" />
</form>
<ul id="gnb">
<!-- main_menu 1차 시작 -->
<!--@foreach($main_menu->list as $key => $val)--><!--@if($val['link'])-->
<!--@if($val['selected'])-->
{@ $menu_1st = $val }
<!--@end-->
<li <!--@if($val['selected'])-->class="on"<!--@end-->>
<a href="{$val['href']}" <!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@end-->>{$val['link']}
</a>
</li>
<!--@endif-->
<!--@endforeach-->
</ul>
</div>
css파일 코드:
#gnb {
position:relative;
top:25px;
left:203px;
white-space:nowrap;
}
#gnb li {
float:left;
background:url(../images/white/bgGnbVr.gif) no-repeat right left;
position:relative;
white-space:nowrap;
}
메인메뉴를 만들었는데요 .. 문제점이 하나 있어요 ..
개발할때 해상도는 1024*768로 했느데 .. 나중에 1280*1024로 하니까 ..
메뉴란이 원래 위치에서 왼쪽으로 넘어갔어요 ..
아래에 .. 해당 코드를 복사해 올려봤습니다.
혹시 원인 아시는분 있으시면 .. 좋은 답변 부탁 드립니다 ..
좋은 하루 되세요 .. ^^
layout.html 코드:
<div align="center" id="top">
<!-- 검색창 -->
<form action="{getUrl()}" method="post" id="isSearch">
<input type="hidden" name="mid" value="{$mid}" />
<input type="hidden" name="act" value="IS" />
<input type="hidden" name="search_target" value="title_content" />
<input name="is_keyword" type="text" class="inputText" title="keyword" />
<input type="image" src="./images/{$layout_info->colorset}/buttonSearch.gif" alt="{$lang->cmd_search}" class="submit" />
</form>
<ul id="gnb">
<!-- main_menu 1차 시작 -->
<!--@foreach($main_menu->list as $key => $val)--><!--@if($val['link'])-->
<!--@if($val['selected'])-->
{@ $menu_1st = $val }
<!--@end-->
<li <!--@if($val['selected'])-->class="on"<!--@end-->>
<a href="{$val['href']}" <!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@end-->>{$val['link']}
</a>
</li>
<!--@endif-->
<!--@endforeach-->
</ul>
</div>
css파일 코드:
#gnb {
position:relative;
top:25px;
left:203px;
white-space:nowrap;
}
#gnb li {
float:left;
background:url(../images/white/bgGnbVr.gif) no-repeat right left;
position:relative;
white-space:nowrap;
}
댓글 3
-
aa
2009.02.23 11:33
-
미션 임포서블
2009.02.23 11:50
감사합니다 .. aa 님 ..
제 생각에두 그 쪽이 문제 좀 있는것 같은데요 ..
현재 position: relative 니까 브라우저상에서 상대위치가 203px 이니까 ..
해상도가 높아도 .. 계속 브라우저상의 상대위치는 203px 이 되는것 같아요 ..
그래서 .. 해상도가 높아질때 .. 다른 컨텐츠들에 비해 왼쪽으로 넘어간것 같애요 ..
원인은 알것 같은데 .. 정작 해결하려니까 ..
어떻게 해야될지 몰라서 이렇게 문제를 드린겁니다 .. -
미션 임포서블
2009.02.23 12:10
문제 해결 .. ^^
#gnb {
position:relative;
width:420px;
top:25px;
left:-68px;
border:0px solid #000000;
white-space:nowrap;
}
넓이를 정해주지 않아서 .. 그런가 보네요 ..
left:203px;
이 부분에서 반응을 한 것 같은데요.