메뉴를 설치했습니다.
기존 그누보드 설치를 하면 메뉴라인이 모니터 화면 끝까지 늘어지는데
이걸 사용하니 딱 1020px에 멈춥니다.
기존 그누보드 설치한 것 처럼 쭈우욱 늘어지게 하려면 어찌해야 할까요?
그리고 Home쪽을 보면 라운드 처리가 되는데 그냥 사각으로 표현하고 싶은데 어찌해야 할까요?
Copy
#cssmenu ul,#cssmenu li,#cssmenu span,#cssmenu a { margin: 0; padding: 0; position: relative;} #cssmenu { line-height: 1; border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; background: #141414; background: -moz-linear-gradient(top, #333333 0%, #141414 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #141414)); background: -webkit-linear-gradient(top, #333333 0%, #141414 100%); background: -o-linear-gradient(top, #333333 0%, #141414 100%); background: -ms-linear-gradient(top, #333333 0%, #141414 100%); background: linear-gradient(to bottom, #333333 0%, #141414 100%); border-bottom: 2px solid #0fa1e0; width: auto;}#cssmenu:after,#cssmenu ul:after { content: ''; display: block; clear: both;}#cssmenu a { background: #141414; background: -moz-linear-gradient(top, #333333 0%, #141414 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #141414)); background: -webkit-linear-gradient(top, #333333 0%, #141414 100%); background: -o-linear-gradient(top, #333333 0%, #141414 100%); background: -ms-linear-gradient(top, #333333 0%, #141414 100%); background: linear-gradient(to bottom, #333333 0%, #141414 100%); color: #ffffff; display: block; font-family: Helvetica, Arial, Verdana, sans-serif; padding: 19px 50px; text-decoration: none;}#cssmenu ul { list-style: none;}#cssmenu > ul > li { display: inline-block; float: left; margin: 0;}#cssmenu.align-center { text-align: center;}#cssmenu.align-center > ul > li { float: none;}#cssmenu.align-center ul ul { text-align: left;}#cssmenu.align-right > ul { float: right;}#cssmenu.align-right ul ul { text-align: right;}#cssmenu > ul > li > a { color: #ffffff; font-size: 13px;}#cssmenu > ul > li:hover:after { content: ''; display: block; width: 0; height: 0; position: absolute; left: 50%; bottom: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #0fa1e0; margin-left: -10px;}#cssmenu > ul > li:first-child > a { border-radius: 5px 0 0 0; -moz-border-radius: 5px 0 0 0; -webkit-border-radius: 5px 0 0 0;}#cssmenu.align-right > ul > li:first-child > a,#cssmenu.align-center > ul > li:first-child > a { border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0;}#cssmenu.align-right > ul > li:last-child > a { border-radius: 0 5px 0 0; -moz-border-radius: 0 5px 0 0; -webkit-border-radius: 0 5px 0 0;}#cssmenu > ul > li.active > a,#cssmenu > ul > li:hover > a { color: #ffffff; box-shadow: inset 0 0 3px #000000; -moz-box-shadow: inset 0 0 3px #000000; -webkit-box-shadow: inset 0 0 3px #000000; background: #070707; background: -moz-linear-gradient(top, #262626 0%, #070707 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #262626), color-stop(100%, #070707)); background: -webkit-linear-gradient(top, #262626 0%, #070707 100%); background: -o-linear-gradient(top, #262626 0%, #070707 100%); background: -ms-linear-gradient(top, #262626 0%, #070707 100%); background: linear-gradient(to bottom, #262626 0%, #070707 100%);}#cssmenu .has-sub { z-index: 1;}#cssmenu .has-sub:hover > ul { display: block;}#cssmenu .has-sub ul { display: none; position: absolute; width: 200px; top: 100%; left: 0;}#cssmenu.align-right .has-sub ul { left: auto; right: 0;}#cssmenu .has-sub ul li { *margin-bottom: -1px;}#cssmenu .has-sub ul li a { background: #0fa1e0; border-bottom: 1px dotted #31b7f1; font-size: 12px; filter: none; display: block; line-height: 120%; padding: 10px; color: #ffffff;}#cssmenu .has-sub ul li:hover a { background: #0c7fb0;}#cssmenu ul ul li:hover > a { color: #ffffff;}#cssmenu .has-sub .has-sub:hover > ul { display: block;}#cssmenu .has-sub .has-sub ul { display: none; position: absolute; left: 100%; top: 0;}#cssmenu.align-right .has-sub .has-sub ul,#cssmenu.align-right ul ul ul { left: auto; right: 100%;}#cssmenu .has-sub .has-sub ul li a { background: #0c7fb0; border-bottom: 1px dotted #31b7f1;}#cssmenu .has-sub .has-sub ul li a:hover { background: #0a6d98;}#cssmenu ul ul li.last > a,#cssmenu ul ul li:last-child > a,#cssmenu ul ul ul li.last > a,#cssmenu ul ul ul li:last-child > a,#cssmenu .has-sub ul li:last-child > a,#cssmenu .has-sub ul li.last > a { border-bottom: 0;}답변 1개 / 댓글 1개
채택된 답변
+20 포인트
그누스트랩
10년 전
해당 css코드에는 없고
#wrapper 코드에 970px로 되어있어서 그럴겁니다.
전체적인틀부분인데 100%로 하시되 안에 div를 한층더 껴주어서
메뉴를 호출하시고 메뉴호출div속성안에 css태그를 970px; float:left; 로 하신뒤 막아주어야합니다.
clear:both; 를 이용하여 끊고 다시 하단을 css로 잡아주어야 정상적으로 되실겁니다.
또는 메뉴쪽에만 해야하는데 소스자체를 올리시면 답변이 어렵네요.
답변에 대한 댓글 1개
답변을 작성하려면 로그인이 필요합니다.