묻고답하기

  2. Support
  3. 묻고답하기

나라디자인 CSS Navigation Bar 사용에 대한 문의 입니다.

2010.11.23 14:11

drimilda

나라디자인 CSS Navigation Bar 사용에 대한 문의 입니다.


지금 기존의 레이아웃을 사용하지 않고
나라디자인 CSS Navigation Bar를  이용해 꾸며 보려하는데....문제가 발생했습니다.

 

레이아웃의 기본틀은
정찬명님의 메뉴얼을 통해 얻은 아래와 같은 레이아웃 뼈대로 꾸미고 있는데...

 

나라디자인 CSS Navigation Bar의
스크롤 메뉴가 로그인창은 물론 게시판이 들어가면 모든 것들의 뒤로 숨어버립니다.

 

레이아웃 스킨의 z-index 값을 조절하라는 답변이 있어
눈씻고 찾아봤으나 z-index 값 자체가 없어 당황 스럽네요.


밑으로는 수정하지 않은 정찬명님의 레이아웃 기본틀 소스 입니다.
잠깐 시간내어서 초보자에게 도움 좀 주시면 진심으로 감사드리겠습니다.^^

------------------------------------------------------------------------------

 

layout.html

 

<div id="xe" class="fixed | liquid | hybrid | aLeft | aRight">
<div id="container" class="c | ce | ec | cee | ece | eec">
<div id="header">
<h1></h1>
<div class="extension"></div>
</div>
<div id="body">
<div id="content"></div>
<div class="extension e1"></div>
<div class="extension e2"></div>
</div>
<div id="footer">
<div class="extension"></div>
<address></address>
</div>
</div>
</div>

 

------------------------------------------------------------------------------

 

layout.css

 


@charset "utf-8";
/* NHN > UIT Center > Open UI Technology Team > Jeong Chan Myeong(dece24@nhncorp.com) */

/*
A CSS framework begins here. We don't recommend modifying framework. You can override these properties by defining the styles outside the framework.
여기서 부터 CSS 프레임웍 입니다. 프레임웍 수정을 권장하지 않습니다. 스킨을 변형할 때 프레임웍 밖에서 선언된 속성으로 덮어쓰기 할 수 있습니다.
*/

/* Layout */
#xe{ position:relative;}
#container{ position:relative;}
#header{ position:relative; clear:both; *zoom:1;}
#header:after{ content:""; display:block; clear:both;}
#body{ position:relative; clear:both; *zoom:1;}
#body:after{ content:""; display:block; clear:both;}
#content{ position:relative; text-align:justify; *zoom:1;}
#content:after{ content:""; display:block; clear:both;}
#footer{ position:relative; clear:both; *zoom:1;}
#footer:after{ content:""; display:block; clear:both;}
#footer address{ text-align:center;}

/* Layout Width */
.fixed #container{ width:960px; margin-left:auto; margin-right:auto;}
.liquid #container{ width:80%; margin-left:auto; margin-right:auto;}
.hybrid #container{ width:80%; margin-left:auto; margin-right:auto;}

/* Layout Align */
.aLeft #container{ margin-left:0;}
.aRight #container{ margin-right:0;}

/* Header Extension */
#header .extension{ position:relative; *zoom:1;}
#header .extension:after{ content:""; display:block; clear:both;}
#header .extension ul{ position:relative;}
#header .extension li{ position:relative; display:inline; list-style:none;}

/* Footer Extension */
#footer .extension{ position:relative; *zoom:1;}
#footer .extension:after{ content:""; display:block; clear:both;}
#footer .extension ul{ position:relative;}
#footer .extension li{ position:relative; display:inline; list-style:none;}

/* Body Extension */
#body .extension{position:relative; *zoom:1; display:none;}
#body .extension:after{ content:""; display:block; clear:both;}
#body .extension .section{position:relative;}

/* ----- Fixed 1 Column Layout ----- */
.fixed .c #body .e1{ display:block; margin-right:-30px;}
.fixed .c #body .e1 .section{ float:left; width:300px; margin-right:30px;}

/* ----- Liquid 1 Column Layout ----- */
.liquid .c #body .e1{ display:block; margin-right:-3.4%;}
.liquid .c #body .e1 .section{ float:left; width:30%; margin-right:3.3%;}

/* ----- Hybrid 1 Column Layout ----- */
.hybrid .c #body .e1{ display:block; margin-right:-30px;}
.hybrid .c #body .e1 .section{ float:left; width:240px; margin-right:30px;}

/* ----- Fixed 2 Column Layout ----- */
.fixed .ce #body .e1,
.fixed .ec #body .e1{ width:220px;}
.fixed .ce #body #content,
.fixed .ec #body #content{ width:720px;}
.fixed .ce #body #content{ float:left;}
.fixed .ec #body #content{ float:right;}
.fixed .ce #body .e1,
.fixed .ec #body .e1{ display:block;}
.fixed .ce #body .e1{ float:right; clear:right;}
.fixed .ec #body .e1{ float:left; clear:left;}

/* ----- Liquid 2 Column Layout ----- */
.liquid .ce #body .e1,
.liquid .ec #body .e1{ width:23%;}
.liquid .ce #body #content,
.liquid .ec #body #content{ width:75%;}
.liquid .ce #body #content{ float:left;}
.liquid .ec #body #content{ float:right;}
.liquid .ce #body .e1,
.liquid .ec #body .e1{ display:block;}
.liquid .ce #body .e1{ float:right; clear:right;}
.liquid .ec #body .e1{ float:left; clear:left;}

/* ----- Hybrid 2 Column Layout ----- */
.hybrid .ce #body{ padding-right:280px;}
.hybrid .ec #body{ padding-left:280px;}
.hybrid .ce #body .e1,
.hybrid .ec #body .e1{ width:260px;}
.hybrid .ce #body #content,
.hybrid .ec #body #content{ width:100%;}
.hybrid .ce #body #content{ float:left;}
.hybrid .ec #body #content{ float:right;}
.hybrid .ce #body .e1,
.hybrid .ec #body .e1{ display:block;}
.hybrid .ce #body .e1{ float:right; clear:right; margin-left:-260px; right:-280px;}
.hybrid .ec #body .e1{ float:left; clear:left; margin-right:-260px; left:-280px;}

/* ----- Fixed 3 Column Layout ----- */
.fixed .cee #body .e1,
.fixed .cee #body .e2,
.fixed .ece #body .e1,
.fixed .ece #body .e2,
.fixed .eec #body .e1,
.fixed .eec #body .e2{ display:block; width:200px;}

.fixed .cee #body #content,
.fixed .ece #body #content,
.fixed .eec #body #content{ width:520px;}

.fixed .cee #body #content{ float:left; margin-right:20px;}
.fixed .ece #body #content{ float:left; margin-right:-100%; left:220px;}
.fixed .eec #body #content{ float:right;}

.fixed .ece #body .e1,
.fixed .eec #body .e1{ float:left; margin-right:20px;}

.fixed .cee #body .e1,
.fixed .eec #body .e2{ float:left;}

.fixed .cee #body .e2,
.fixed .ece #body .e2{ float:right;}

/* ----- Liquid 3 Column Layout ----- */
.liquid .cee #body .e1,
.liquid .cee #body .e2,
.liquid .ece #body .e1,
.liquid .ece #body .e2,
.liquid .eec #body .e1,
.liquid .eec #body .e2{ display:block; width:20%;}

.liquid .cee #body #content,
.liquid .ece #body #content,
.liquid .eec #body #content{ width:56%;}

.liquid .cee #body #content{ float:left; margin-right:2%;}
.liquid .ece #body #content{ float:left; margin-right:-100%; left:22%;}
.liquid .eec #body #content{ float:right;}

.liquid .ece #body .e1,
.liquid .eec #body .e1{ float:left; margin-right:2%;}

.liquid .cee #body .e1,
.liquid .eec #body .e2{ float:left;}

.liquid .cee #body .e2,
.liquid .ece #body .e2{ float:right;}

/* ----- Hybrid 3 Column Layout ----- */
.hybrid .cee #body .e1,
.hybrid .cee #body .e2,
.hybrid .ece #body .e1,
.hybrid .ece #body .e2,
.hybrid .eec #body .e1,
.hybrid .eec #body .e2{ display:block; width:220px;}

.hybrid .cee #body{ padding-right:480px;}
.hybrid .ece #body{ padding-left:240px; padding-right:240px;}
.hybrid .eec #body{ padding-left:480px;}

.hybrid .cee #body #content,
.hybrid .ece #body #content,
.hybrid .eec #body #content{ width:100%;}

.hybrid .cee #body #content,
.hybrid .ece #body #content{ float:left; margin-right:-100%;}
.hybrid .eec #body #content{ float:right;}

.hybrid .ece #body .e1,
.hybrid .eec #body .e2{ float:left; left:-240px; margin-right:-220px;}
.hybrid .eec #body .e1{ float:left; left:-480px; margin-right:-220px;}

.hybrid .cee #body .e1,
.hybrid .ece #body .e2{ float:right; left:240px; margin-left:-220px;}
.hybrid .cee #body .e2{ float:right; left:480px; margin-left:-220px;}

/*
A CSS framework ends here. We don't recommend modifying framework. You can override these properties by defining the styles outside the framework.
여기까지 CSS 프레임웍 입니다. 프레임웍 수정을 권장하지 않습니다. 스킨을 변형할 때 프레임웍 밖에서 선언된 속성으로 덮어쓰기 할 수 있습니다.
*/


------------------------------------------------------------------------------

 

부탁드립니다.

이 게시물을
좋아요
목록
글쓴이 제목 최종 글
XE 공지 글 쓰기,삭제 운영방식 변경 공지 [16] 2019.03.05 by 남기남
뱌레알 XEShop-상품을 브랜드별로 따로볼수있나요? [1] 2010.11.22 by Arp
크롬_crom 메뉴 active, hover에 관한 질문입니다. [1] 2010.11.22 by ForHanbi
신정 서버교체후 재설치시 mysql선택부분에서 멈췄어요...  
송지하 글 작성시 빨간 네모 상자가 자동으로 쳐집니다. [1] 2010.11.22 by SeklutZ
장뚱이 접속 통계를 상세히 보여주는 위젯은? [1] 2010.11.22 by SeklutZ
삐닦하년 embed 코드... [1] 2010.11.22 by SeklutZ
루시페루 MiteKiku 로그인 위젯 스킨 [1] 2010.11.22 by SeklutZ
쌈꾼 카페 생성했을때..메뉴위젯이 안보이네요 ㅠㅠ [1] 2010.11.22 by 정찬명
빛의바다 글 쓸때 본문입력하는 부분을 뺄 수는 없나요?? [2] 2010.11.22 by 성범918
이동민203 게시판 에디터 폰트 수정은 어디에서??  
꼼도리 Fatal error: Call to undefined function d() xe/index.php on line 36 [1] 2010.11.22
raystorm 접속 시"HTTP 403 사용권한 없음" 메세지가 뜹니다. [1] 2010.11.22 by DuRi
꽃구름 아무도 모르시는거 같아서 다시 올립니다~ [1] 2010.11.22 by 망꼬준
강경돈636 상자위젯 이미지 밀림현상 [2] file 2010.11.22 by 망꼬준
NMS 엔지니어 패스워드 분신 물의 [2] 2010.11.22 by 망꼬준
전우치라고해요 게시판 관리의 분류관리와 사이트설정의 메뉴 가 나타나지 않습니다. [2] 2010.11.22 by 우산속
정진석437 계정 변경에 따른 데이터 이동  
루시페루 위젯 코드 html에 적용 제발! [1] 2010.11.22 by SeklutZ
RainDrop+ mysql 중첩쿼리문 xml로 변환하기 질문입니다. [1] 2010.11.22 by 라르게덴
하나비839 도와주세요 ㅠ..ㅠ ; DQ_LIBS/include 폴더에서 파일하나를 삭제했는데 file  
쮸야282 페이지를 메인으로 설정 방법좀 갈켜주세요 [1] 2010.11.22 by 스카이피아
김은태 bodex 상위 영역에 놓은 위젯 캐시 적용시키는 방법을 알려주세요  
sugarkane XE 포기 단계까지 ㅠ; 큐브리드 이전에 관해  
박중현446 다운로드 시 결제하고 다운로드  
이온디 width값이 줄어들어도 내부 레이어의 위치는 고정되게 [1] file 2010.11.23 by ForHanbi
김신일996 Content 출력(새글 보기) 위젯 수정 후 테두리 문제 해결 부탁해요! file  
불패의초인 웹진 형식으로 해놨는데 사진이 안뜨네요 왜그러죵 ?! [1] 2010.11.23 by criuce
drimilda 나라디자인 CSS Navigation Bar 사용에 대한 문의 입니다. [1] 2010.11.23 by ForHanbi
멀루할까 익스 8문제 file  
기대여 로그인이 안되요  
태그 쓰기