수다닷컴

■ 발생 환경 :
OS : window8 테스트 브라우저 : IE7~10, FF, Chrome, Opera 비교 브라우저
(정상적으로 나오는 브라우저) : 모두 다 같은 결과

■ 문제발생 URL (jsfiddle, jsbin. codepen 등 활용):
http://

■ 발생 문제에 대한 자세한 기술:
이슈 : GNB 디자인과 코딩 결과의 차이 입니다.

* htmldiv id=gnbulli class=firsth2span메뉴명/span/h2ul class=snblia href=#서브메뉴/a/li/ul/lilih2span메뉴명/span/h2ul class=snblia href=#서브메뉴/a/li/ul/lili class=lasth2span메뉴명/span/h2ul class=snblia href=#서브메뉴/a/li/ul/li/ul/div
* css#header #gnb{clear:both;height:33px;background:#5e5e5e url(/asset/images/com/bg_gnb.gif) repeat-x 0 0}#header #gnb ul li{position:relative;float:left;background:url(/asset/images/com/bg_gnb_off.gif) no-repeat 0 0}#header #gnb ul li.first h2{background:url(/asset/images/com/bg_gnb_first_off.gif) no-repeat 0 0}#header #gnb ul li.last h2{background:url(/asset/images/com/bg_gnb_last_off.gif) no-repeat right 0}#header #gnb ul li h2{font-size:14px;color:#cdcdcd;padding:0 15px;line-height:33px;text-align:center;cursor:pointer}#header #gnb ul li h2.active{color:#fff;padding:0 0 0 15px;background:url(/asset/images/com/bg_gnb_on.gif) no-repeat 0 0}#header #gnb ul li h2.active span{display:inline-block;padding-right:15px;background:url(/asset/images/com/bg_gnb_on_right.gif) no-repeat right 0}
위와 같은 구조로 되어 있습니다.이미지로 현재 문제점을 보여드리자면 아래와 같습니다.

off의 디자인이 두가지 형태입니다.현재 선택된 메뉴의 바로 다음 메뉴 디자인이 보시다시피 다릅니다.각 li에 on/off 스타일을 주었는데 이런 경우 해결할 방법이 있을까요?제가 모르는 방법이 있을지도 몰라 이렇게 글을 쓰게 되었습니다.디자인 변경 요청을 하긴 했는데 이렇게 꼭 됐으면 좋겠다 라는 답변이라서요. ㅜㅜ

신청하기