메인 메뉴 중앙 정렬하기 - 기초활용강좌, 그누보드5강좌

본문 바로가기
전체검색

기초활용강좌

그누보드, 영카트 초보 제작자분들을 위한 다양한 스킨 제작 활용 팁을 공유합니다.

메인 메뉴 중앙 정렬하기

관리자 18-08-02 09:36

그누보드 5.3버전 기본 메뉴는 좌측 정렬인데 중앙 정렬로 변경하는 방법입니다.

07873020e1523563deaa821e368e9b53_1533169855_7887.png

그누보드를 처음 설치해서 메뉴를 생성하면 이렇게 왼쪽으로 정렬되어 있죠.

수정 파일 css/default.css
테마 사용 중이면 theme/basic/css/default.css


아래 코드를 찾은 후 text-align:center 추가.
#gnb .gnb_wrap{margin:0 auto;position:relative;text-align:center}

#gnb .gnb_1dli{float:left;line-height:50px;padding:0 15px;position:relative;}
여기를 이렇게 변경.
#gnb .gnb_1dli{display:inline-block;line-height:50px;padding:0 15px;position:relative;}

07873020e1523563deaa821e368e9b53_1533169969_6715.png

가운데 정렬은 되지만 왼쪽 전체 메뉴 펼치기 아이콘 위치가 애매하네요.
이대로 쓰실 분들은 그대로 사용하시면 되고 저 아이콘만 별도로 왼쪽에 고정시키는 방법입니다.

아래 코드를 찾은 후 position:absolute;left:0 추가
#gnb .gnb_mnal{padding:0;position:absolute;left:0}

07873020e1523563deaa821e368e9b53_1533170126_5568.png

수정 후 화면입니다. 왼쪽에 고정되었네요.

댓글목록 +3

댓글목록

profile_image

쓰리우동님의 댓글

쓰리우동 작성일

감사합니다..덕분에..많은 공부가됩니다

profile_image

hanscopy님의 댓글

hanscopy 작성일

일목요연하게 잘 정리해주셔서 감사할 뿐입니다.
테크에서 그누로 최근에 갈아타니 모든 게 낯설었는데 큰 도움주십니다.
특히나 글쓰기/본문/목록 에 따른 변수설명은 압권입니다.
테크놋에서는 사실 정리가 잘되었습니다.
더이상 버전업이 아니어서 아쉽지만 손을 놓았다가 갈아탔는데요..
귀 홈피에서 많은걸 배워갑니다.~~~

참, 한줄토크가 링크가 안됩니다?

profile_image

관리자님의 댓글의 댓글

관리자 작성일

변수 설명 그게 예전 버전이라서 그누보드5.3 버전하고 일부 차이가 있을 겁니다.
업데이트하려다가 그누보드5.4 버전이 예정되어 있어서 5.4 정식 버전 나오면 전체적으로 새롭게 올릴 계획입니다.
한줄토크는 그누스터디 개편하면서 스킨을 아직 못 만들었습니다. 예전에 스킨으로 배포한다고 했었는데 약속도 아직 못 지켰군요.

로그인 후 댓글 작성 가능합니다.

로그인

로그인 후 글 작성 가능합니다.
그누스킨닷컴

그누스터디는 그누보드, 영카트를 이용하시는 초보 사용자를 위한 정보를 공유합니다.

E-MAIL : gnustudy@naver.com / 카카오톡 : gnustudy / 텔레그램 : gnustudy
제작 문의를 제외한 일반 문의는 QA 게시판을 이용해주세요.

Copyright gnustudy.com All rights reserved.