묻고답하기

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

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:18]

이 게시물을

글쓴이	제목	최종 글
XE	공지 글 쓰기,삭제 운영방식 변경 공지 [16]	2019.03.05 _by 남기남
Oxygen82	Core ver. 1.5.0.8 겔러리용 게시판 리스트에 확장변수나오게 하는방법이...
김태숙229	레이아웃 index에 위젯설정문제..급해요 ㅠ.ㅠ [1]	2011.11.18 _by 이성운836
최혁준489	비회원 추천 방법 아시는분!!? [1]	2011.11.18 _by 빽짱구
하늘384	에러문구 [1]	2011.11.18 _by 이끼다
제이호	페이지 및 게시판 수정이 않됩니다.ㅡㅡ [1]	2011.11.18 _by 이끼다
김형준509	홈페이지 접속시 화면 사라집니다. [1]	2011.11.18 _by 이끼다
쿵푸팬더	이미지 클릭후 드래그를 못하고 있습니다.ㅠㅠ
스구루	자신의 글이나 댓글에 댓글이 달리면 알려주는 방법 [1]	2011.11.18 _by 카이네드
하늘384	회원 로그인
준돌이	1.5 업데이트후 기절할것 같습니다... [1]	2011.11.18 _by Goos
lovesan	xe설치 폴더 이동................? [1]	2011.11.17 _by 이끼다
아라비카21	불러온 외부페이지에서 css/js가 적용되질 않습니다ㅠㅠ [1]	2011.11.17 _by 이끼다
하지요!	xe 게시물 내에 그 게시물 작성자가 쓴 최근 글 보여주기 기능?
ibwj	rss 내용 수정 질문드립니다.
제이빅	게시판 제거 문제와 댓글 등록시 '내용에 값을 입력해주세요' [1]	2011.11.17 _by 파이델
alljoy	페이지에 플래시 파일넣을때.... [1]	2011.11.17 _by 소나무 열매
mrbj	관리자모드에서 [1]	2011.11.17 _by 송동우
wide222	모바일페이지로 앨범을 만들고 싶습니다.
simzi	제발좀 도와주세요!!! ;ㅂ; 우어어어엉
jwSeo	xe 첨부파일 100%에서 증발문제 [1]	2011.11.17 _by 굿총
카이네드	본문옆에 top/down 이 옆에서 따라다니게 하고 싶습니다. [2]	2011.11.17 _by 똑디
명드래곤	대용량 이미지 첨부시 썸네일이 생성되지 않습니다 ㅠ [1]	2011.11.17 _by 물비늘
쿵푸팬더	이미지 드래그가 안됩니다.
아담하와	포인트 차감 게시글 최상위로 올리기 기능 ..
무비스타	가입하기 폼을 줄이는 방법 알려주세요.
시골영감	송동우님!!! 죄송하지만 좀 도와주세요.(초기접속 화면 관련) [1]	2011.11.16 _by 老姜君
Goos	1.5로 만들기 시작한 사이트, 1.4로 다운그레이드 가능할까요? (소셜xe문제 포함)
내맘에들어오면	댓글쓸때 별점 줄수있는 법 문의 드립니다.
달빛밴드	1.5 버전 회원가입 모듈쪽 문의
노엔젤	글쓰기 에디터툴에대해 질문있습니다. [1]	2011.11.16 _by 노엔젤

태그 쓰기

묻고답하기

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

댓글 0

About

Get involved

Blog

Download

Support

Showcase