묻고답하기

고수님들 테그좀 살펴봐주세요!! (__)

2011.11.08 16:40

아즈고스트

홈페이지를 새롭게 시작하고 있습니다.

노트북 및 데스트 탑으로 화면을 볼 경우 레이아웃이 잘 잡혀있는데요, 모바일에서 pc 버전으로 보면 중간(콘텐츠) 및 오른쪽(공간)이 상단 메뉴를 가려 버립니다.

테그 또는 소스에서 조금만 건들면 될 것 같은데 모바일 레이아웃에 맞추면 컴퓨터로 봤을 때 너무 내려와 있고, 컴퓨터로 레이아웃을 맞추면 모바일에서 메뉴가 무척이나 내려오세요 OTL

고수님들 도와주세요!!

사이트 : http://travellerroad.com

레이아웃 css

/* Site Layout - Body Wrap */
body { background:#ffffff; margin:0; padding:0; font-family:굴림; Dotum; position:relative; }
#bodyWrap { position:relative; width:970px; z-index:1200;margin:0 auto; padding:0em 0 0 0; *padding:1.0em 0 1.0em 0;}

#logo { position:absolute; float:left; padding:10px 0 0 0; margin:0; }
#logo h1 { padding:0; margin:0; }

/* Site Layout - Header
#header { position:relative; width:980px; height:90px; border-top:10px solid #ffffff; background:url(../images/white/bgHeader.png) no-repeat right bottom; margin-top:0; margin-bottom:0; z-index:99;}
#header h1 { position:absolute; top:0; left:0px; margin:0; } */

/* Site Layout - Top */
#wrap_top { margin:0; padding:0; background:url(../img/bg_top.gif) repeat-x; }
#container_top { width:970px; height:40px; margin:0 auto; position:relative; z-index:1200; }
#search_box { float:right; padding:1px; background:url(../img/search_box.gif) no-repeat; width:153px; height:23px; margin-top:7px; margin-right:-2px;}
#search_text_box { float:left; padding:4px 0 0 0;}
#search_button_box { float:right; padding:3px 7px 0 0 ;}
.search_textbox { height:18px; padding:0px 4px; margin:-2px 0 0 1px; width:110px; border:0; color:#999;}
.search_submit { height:18px; padding:2px; margin:2px;}

#top_gnb { float:right; padding-top:10px; margin:0; }

#top_gnb ul { float:right; padding:0; margin:0; text-align:right; }
#top_gnb li {display:inline; list-style:none; margin-right:1px; color:#000; font:10px "Trebuchet MS", Tahoma; white-space:nowrap; vertical-align:top; text-decoration:none;}
#top_gnb li strong {color:#7694D0; font-family:Gulim;}
#top_gnb li a {color:#000;letter-spacing:0px; text-decoration:none;}
#top_gnb li a:hover {display:inline; color:#2B61CD; text-decoration:none; }
#top_gnb .new {position:absolute; display:block; width:23px; height:14px; top:66px; right:450px; z-index:101;}

/* Site Layout - Menu */
/* Menu */
#gnb {float:right; top:20px; height:55px; margin:65px 0 0 0; padding:0 0 0 0px; }
#gnb ul,
#gnb li { float:left; list-style:none; position:relative font:13px Gulim; }
#gnb li .addon_menu_new { display: block; left:95px; *left:42px;}
#gnb li a { display:block; float:left; width:115px; height:44px; padding:13px 0 0 0; color:#222; text-align:center; text-decoration:none; }
#gnb li a:hover {font-weight:bold; color:#2B61CD; }
#gnb li.on a {font-weight:bold; color:#2B61CD; height:44px; padding:11px 0 0 0; }

#lnb { margin:0; padding:5px 0 0 0;}
#lnb li { list-style:none; margin:0; padding:2px 0 5px 15px; }
#lnb li a { font:12px Malgun Gothic; margin:0; padding:0 5px 7px 3px; width:123px; display:block; border-bottom:1px dotted #dedede; position:relative; z-index:99; text-decoration:none; background:url(../images/white/bulletLnb.gif) no-repeat right;}
#lnb li a:hover ,
#lnb li a:focus { color:#0072BC; margin:0; background:url(../images/white/bulletLnbOn.gif) no-repeat right;}
#lnb li.on a { margin:0; font-family:Malgun Gothic; font-weight:normal; color:#0072BC; background:url(../images/white/bulletLnbOn.gif) no-repeat right;}
#lnb li.on a:hover,
#lnb li.on a:focus { margin:0; font-weight:normal;}
#lnb li ul { display:block; position:relative; margin:0; width:87px; padding:0 4px 0 0; position:relative; overflow:hidden;}
#lnb li.on ul { display:block;}
#lnb li ul li { padding:0; margin:0; position:relative; top:-1px; border-bottom:1px dotted #dedede; }
#lnb li ul li a { padding:5px 5px 5px 15px; margin:0; width:87px; color:#818181 !important; border:none; background:none !important; border:none !important; background:url(../images/white/bulletLnbUl.gif) no-repeat 73px center!important;}
#lnb li ul li a:hover,
#lnb li ul li a:focus { font-weight:normal !important; color:#0072BC !important; background:url(../images/white/bulletLnbUlOn.gif) no-repeat 73px center!important; }
#lnb li.on ul li.on a { color:#0072BC !important; font-weight:normal !important; background:url(../images/white/bulletLnbUlOn.gif) no-repeat 73px center!important;}

/* Site Layout - Content Body */
#contentBody { position:relative; border:0; width:980px; margin:0; padding:0; overflow:hidden; }

/* Site Layout - Column Left */
#columnLeft { position:absolute; float:left; margin-top:152px; padding:0; width:120px; border:1px solid #e1e1e1; overflow:hidden;}
#columnLeft .leftbox { width:120px; clear:both; }
#columnLeft .leftbox_top { position:relative; width:120px; height:50px; padding-top:25px; color:#fff; font:14px Malgun Gothic; font-weight:bold; overflow:hidden; background-color:#595959; text-align:center;}
#columnLeft .leftbox_bottom { position:relative; width:120px;}
#columnLeft .mask {padding-top:5px; }

/* Site Layout - Column Center */
#columnCenter { float:left; overflow:hidden; margin-left:130px; margin-top:11px; padding-top:0; }
#columnCenter .bg {overflow:hidden; margin:0; width:610px; text-align:left; }
#columnCenter .content {overflow:hidden; margin:15px 0px 0px 0px; }
#contentCenter_top { position:relative; width:610px; height:10px; _margin-top:10px; padding:0; text-align:center; overflow:hidden;}
#contentCenter_bottom { position:relative; width:610px; height:10px; padding:0; text-align:center; overflow:hidden;}
#content { width:100%; overflow:hidden;}

/* Site Layout - Column Right */
#columnRight { float:left; width:210px; margin:35px 0 20px 10px; border:1px solid #e1e1e1; }
#columnRight .right {width:210px; }
#columnRight .right_top { position:relative; width:210px; height:10px; margin:0; padding:0; }
#columnRight .right_bottom { position:relative; width:210px; height:10px; margin:0; padding:0; }
#columnRight .profile {width:210px; padding:0 10px;}
#columnRight .mask {padding-top:5px; }

/* Site Layout - Bottom */
#wrap_top2 {background-color:#282828; margin-top:0px; overflow:hidden; width:100%;}
#wrap_bottom2 { /*background:url(../img/bg_bottom.gif) repeat-x 0 50px;*/ background-color:#F7F3EF; margin-top:180px; overflow:hidden; width:100%;border-top:1px solid #DFDEDC; }
bottom_gnb {margin:0; position:relative; text-align:center; clear:both; }
#bottom_gnb ul { margin:15px 0 20px 0; padding:0;text-align:center;}
#bottom_gnb li {display:inline; list-style:none; color:#333333; font-family:tahoma; padding:0 2px 0 2px; font-size:1.0em; white-space:nowrap; vertical-align:bottom;}
#bottom_gnb li strong {color:#B4B4B4; font-weight:normal; font-size:.95em; font-family:tahoma; padding:0;}
#bottom_gnb li a {color:#737373;letter-spacing:0px; text-decoration:none;}
#bottom_gnb li a:hover {display:inline; color:#2b61cd; text-decoration:none; }

/* ModalWindow */
.jqmOverlay { background-color:#000; }
#loginWindow{ display:none; position:absolute; background-color:#f3f3f3; top:10px; left:50%; padding:5px; width:340px; margin-left:-196px; z-index:10000; border:1px solid #d4d4d4; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; }
.loginWindow.open{ display:block; }
.loginWindow .modalWindow{ display:block; position:fixed; border:0; left:0; top:0; _position:absolute; width:100%; height:100%; background:#fff; opacity:.3; filter:alpha(opacity:70);}
.loginWindow .loginLayer{ position:absolute; width:289px; top:120px; left:50%; padding:30px; border:2px solid #737373; margin:0 0 0 -175px; background:#fff; }
.loginWindow .loginLayer form{ display:none; *zoom:1; margin:0 0 29px 0;}
.loginWindow .loginLayer form:after{ content:""; display:block; clear:both;}
.loginWindow .loginLayer form legend{ position:absolute; width:0; height:0; overflow:hidden; font-size:0; line-height:0; visibility:hidden;}
.loginWindow .loginLayer fieldset{ border:0; margin:0; padding:0;}
.loginWindow .loginLayer.loginTypeA form.typeA,
.loginWindow .loginLayer.loginTypeB form.typeB{ display:block;}
.loginWindow .loginLayer dl{ margin:0; padding:0 0 1px 0;}
.loginWindow .loginLayer dt{ font-size:12px; font-weight:bold; color:#868d95; margin:0 0 2px 0;}
.loginWindow .loginLayer dd{ margin:0 0 21px 0;}
.loginWindow .loginLayer .inputText{ width:269px; height:31px; padding:6px 9px 0 9px; border:1px solid #ddd; font:20px Tahoma; color:#333;}
.loginWindow .loginLayer .inputText:focus{ background-color:#fbfbfb;}
.loginWindow .loginLayer .inputCheck{ margin:0 3px 0 0; width:13px; height:13px; vertical-align:middle;}
.loginWindow .loginLayer.loginTypeA .inputText{ background-image:url(../images/white/bgLoginText.gif); background-repeat:no-repeat; background-position:right top;}
.loginWindow .loginLayer .keep{ margin:0; float:left; font-size:12px; line-height:normal; white-space:nowrap;}
.loginWindow .loginLayer .keep label{ color:#555;}
.loginWindow .loginLayer .loginButton,
.loginWindow .loginLayer .loginButton input{ position:relative; border:0; color:#fff; font-size:12px; font-weight:bold; display:inline-block; height:36px; line-height:36px; background-color:transparent; background-image:url(../images/white/buttonLoginAction.gif); background-repeat:no-repeat; overflow:visible;}
.loginWindow .loginLayer .loginButton{ float:right; background-position:0 0; right:11px;}
.loginWindow .loginLayer .loginButton input{ left:11px; background-position:right 0; padding:0 30px 0 45px; cursor:pointer;}
.loginWindow .loginLayer .help{ margin:0 -30px -30px -30px; padding:14px 0; list-style:none; text-align:center; background:#fafafa; border-top:1px solid #f2f2f2;}
.loginWindow .loginLayer .help li{ display:inline; font-size:12px; line-height:11px; padding:0 0 0 5px;}
.loginWindow .loginLayer .help li.join{ font-weight:bold; }
.loginWindow .loginLayer .help li.find{ border-left:1px solid #b3b3b3;}
.loginWindow .loginLayer .help li.typeA,
.loginWindow .loginLayer .help li.typeB{ display:none; border-left:1px solid #b3b3b3;}
.loginWindow .loginLayer.loginTypeA .help li.typeA,
.loginWindow .loginLayer.loginTypeB .help li.typeB{ display:inline;}
.loginWindow .loginLayer .help li a{ text-decoration:none; color:#555;}
.loginWindow .loginLayer .help li a:hover{text-decoration:none; color:#0072BC;},
.loginWindow .loginLayer .help li a:active,
.loginWindow .loginLayer .help li a:focus{ text-decoration:underline;}
.loginWindow .loginLayer .close{ position:absolute; cursor:pointer; border:0; padding:0; top:0; right:0; width:27px; height:27px; background:transparent url(../images/white/buttonCloseX.gif) no-repeat center center;}
.loginWindow .loginLayer .close span{ position:absolute; font-size:0; line-height:0; width:0; height:.; overflow:hidden; visibility:hidden;}

/* White Skin - End */

레이아웃 설정 테그

<div id="wrap_top">
<div id="container_top">
<div id="search_box">
   <form action="{getUrl()}" method="post" id="isSearch">
    
    <input type="hidden" name="vid" value="{$vid}" />
    
    <input type="hidden" name="mid" value="{$mid}" />
    <input type="hidden" name="act" value="IS" />
    <input type="hidden" name="search_target" value="title_content" />
    <div id="search_text_box"><input name="is_keyword" title="keyword" type="text" size="19" class="search_textbox" /></div>
    <div id="search_button_box"><input type="image" onclick="javascript:;" src="img/btn_search.gif" alt="{$lang->cmd_search}" class="submit"/></div>
   </form>
  </div>
    <div id="top_gnb">
        <ul>
          
           <li><is_admin=="Y")-->http://www.lduhtrp.net/or80c37w1-LRPOPSRRLNMURTMOP" alt="" border="0"/></a></div>
           </div>

           <div class="content">
             {$content}
           </div>

</div>
<div id="contentCenter_bottom"></div>

</div>

</div></div>
           
           <div id="wrap_bottom2">
           <center>하단 메뉴 설정</center> </div>

SC20111108-161827.jpeg [File Size:68.2KB/Download:19]

이 게시물을

글쓴이	제목	최종 글
XE	공지 글 쓰기,삭제 운영방식 변경 공지 [16]	2019.03.05 _by 남기남
pollogi	제로보드 게시판 글등록시 테이블이 이상하게 나옵니다 [1]	2008.12.04 _by 백성찬
Ray™	접속중인회원 아이콘 문제
지팡이+	글쓰기 권한이 않됩니다. 도움부탁합니다. [3]	2008.12.04 _by 홍종표
clrodi	꼬릿말기능을 넣으려고하는데 초짜라서 잘모르겠어요ㅠ,ㅠ
chiaya	제로보드 업글시 기존게시물들... [4]	2008.12.04 _by chiaya
윤진기	휴......................제발좀 도와주십쇼!!!!!!!!! [11]	2020.03.14 _by 윤진기
학이	방명록 설치 했는데 회원 가입 꼭 해야하나요? [5]	2008.12.04 _by guny
윤진기	도와주세요!!!!!!!!!!!!!!!!!!!!!(!나오면서 오류가 나는이유가뭘까요?) [4]	2008.12.04 _by 윤진기
오명환666	게시판 길이조절 질문입니다 [1]	2008.12.04 _by 느까끼
폼첩쿤	상단 메뉴들이 겹치는 현상이 일어 납니다. [2]	2008.12.04 _by guny
banca	홈페이지 설정중 [4]	2008.12.04 _by 느까끼
그뉵	이 소스 오류 좀 찾아주세요. -_- [1]	2008.12.05 _by 느까끼
asdsdsas	왜 이러는지 도와주세요ㅠ.ㅠ
셋쇼마루	(윈도우2003에서) 아이디/비밀번호 찾기 이메일 설정팁!!
ccamiro	로그인 정보가 왜 이렇게 보일까요... [1]	2008.12.05 _by 센세이션
로엘로니	글제목의 폰트를 바꾸고싶은데요 ''''ㅂ;; [1]	2008.12.05 _by 센세이션
~도기	공격을 받는 것 같습니다.
복고열전	컴퓨터 잘하시는 형님들 도와주세요..조회수 올리는방법. [2]	2008.12.05 _by ◀CGlink▶
아쮸구리	게시판에 레벨 아이콘이 안뜨네요 ㅠㅠ [1]	2020.03.14 _by 아쮸구리
아쮸구리	고수님들 꼭 봐주세요 ㅠㅠ(스크린샷게시판및 쪽지)
박종록	버젼 갈아탈때요...과정/방법 급질문... [4]	2008.12.05 _by 박종록
큰바위	1.1.1 패치 후 로그인이 안됩니다. [2]	2008.12.05 _by 큰바위
김영근	제로보드4 와 XE 를 같은 계정에 설치해서 사용할수 있나요?? [2]	2008.12.05 _by 냉무닷컴
문양호	아래 그림처럼 메뉴를 만들려고하는데 조언 부탁드려요 [2]	2008.12.05 _by 문양호
샤릉해	[포토샵, 드림위버 질문] 이미지맵과 레이어 show hide [1]	2008.12.05 _by 샤릉해
쌀콩	이미 존재하는 모듈이름 오류 아시는분... [1]	2008.12.05 _by 느까끼
Cocoa-Mind	웹진형 위젯 사용할 때 줄바꿈 처리.. [3]	2008.12.05 _by 아케보노
박노열	홈페이지가 자주 멈추는 것은 왜일가요?
인도	홈페이지패키지내에 자동으로 생성된 홈페이지를 삭제하는 방법이 없나요? [3]	2008.12.05 _by 느까끼
이니영혼	이미지첨부후 본문삽입후 등록시 사이트 전체를 먹통시키는 문제. [11]	2008.12.05 _by 이니영혼

태그 쓰기

묻고답하기

고수님들 테그좀 살펴봐주세요!! (__)

댓글 0

About

Get involved

Blog

Download

Support

Showcase