채택완료

그누보드 기본 default css 문의좀

700cf72aa117070e54b4a2eba17dc0fc_1414653808_7192.png

 

 

700cf72aa117070e54b4a2eba17dc0fc_1414653808_6783.png
 

 

 

그누보드 설치하면 기본적으로 출력되는 상단과, 하단 페이지 인데요.

 

보면 좌우가 100% 주욱 색이 포함되어 출력이 되잖아요.

 

 

700cf72aa117070e54b4a2eba17dc0fc_1414653915_6182.png
 

 

현재 그누보드 처럼 중간 페이지 부분만 색상이 출력이 되고,

좌우 끝까지 색상이 출력되는 부분을 없애려고 합니다.

 

우선 상단을 보니 메뉴 부분이

 

<nav id="gnb">

 

<ul id="gnb_1dul"> 

 

이렇게 영향을 받는거 같은데요,

 

Copy
/* 메인메뉴 */#gnb {position:relative;margin:-1px 0 0;border-top:1px dotted #dde4e9;border-bottom:1px solid #dde4e9;background:#ecf0f7}#gnb h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}#gnb_1dul {margin:0 auto !important;padding:0;width:970px;zoom:1}#gnb_1dul:after {display:block;visibility:hidden;clear:both;content:""}.gnb_1dli {z-index:10;position:relative;float:left}.gnb_1da {display:inline-block;padding:0 40px 0 10px;height:35px;background:url('../img/gnb_bg00.gif') center right no-repeat;font-weight:bold;line-height:2.95em;text-decoration:none}.gnb_1da:focus, .gnb_1da:hover {background:url('../img/gnb_bg00.gif') #333 center right no-repeat;text-decoration:none}.gnb_1dli_air .gnb_1da {background-color:#333;color:#fff}.gnb_1dli_on .gnb_1da {background-color:#333;color:#fff}.gnb_2dul {display:none;position:absolute;top:35px;width:180px}.gnb_2da {display:block;padding:13px 10px;text-align:left;text-decoration:none}.gnb_1dli_air .gnb_2da {background-color:#333;color:#fff}.gnb_1dli_on .gnb_2da {background-color:#333;color:#fff}.gnb_2da:focus, .gnb_2da:hover {background:#666;text-decoration:none}.gnb_1dli_over .gnb_2dul {display:block;left:0;background:#fff}.gnb_1dli_over2 .gnb_2dul {display:block;right:0;background:#fff}

 

위에 부분인거 같은데, 어떤 값이 영향을 미치는 건가요?

 

|

답변 1개 / 댓글 2개

채택된 답변
+20 포인트

여기서 하는게 낫지 않을까요.

/* 상단 레이아웃 */

#hd {z-index:4;position:relative;min-width:970px;background:#fff}

여기를 아래처럼

#hd {z-index:4;position:relative;margin:0 auto;width:970px;background:#fff}

 

/* 하단 레이아웃 */

#ft {min-width:970px;border-top:1px solid #dde4e9;background:#f2f5f9}

여기를 아래처럼

#ft {margin:0 auto;width:970px;border-top:1px solid #dde4e9;background:#f2f5f9} 

답변에 대한 댓글 2개

감사합니다.
제가 잘 몰라서 css 코드를 보고 역으로 인터넷으로 찾아가면서 무엇인가 배워가고 있습니다.
숫자나 색상 같은건 아무거나 막 찍어보면 확연히 보여서 쉽게 알수 있는데, 그렇게 해서 이건 바귀질 않아서요 ;;

알려주신 부분 찾아 보겠습니다.
우선은 찾아보기 전에 바로 적용해 보았습니다.
잘 되네요.. 감사합니다.

margin:0 auto;

margin은 이해했는데, auto 옵션도 찾아 봐야겠습니다.

답변을 작성하려면 로그인이 필요합니다.