메뉴 수정하고있는데요..
전체 넓이를 900px; 으로 주니까 메뉴들이 수직 정렬이 되어버리네요..
원본은 메뉴개별로 넓이가 설정되어있어서. 홈피에적용하긴무리고..
l ul { list-style-type:none; }li { display:inline; } 주면 넓이때문에 안되구..
플롯으로도 안되네요..
html body ul#nav ul
,html body ul#nav ul li {
width:200px;
}
html body ul#nav ul ul {
margin:0 0 0 200px;
}
,html body ul#nav ul li {
width:200px;
}
html body ul#nav ul ul {
margin:0 0 0 200px;
}
/* Theming the menu */
ul#nav {
float:left;
font-size:90%;
float:left;
font-size:90%;
}
ul#nav ul {
background:#222;
}
background:#222;
}
ul#nav li a {
float:left;
width:900px;
padding:20px 30px;
font-family:"Lucida Sans","Century Gothic","Franklin Gothic Book","Franklin Gothic",helvetica,arial,verdana,sans;
text-decoration:none;
background:#222;
color:#fff;
}
float:left;
width:900px;
padding:20px 30px;
font-family:"Lucida Sans","Century Gothic","Franklin Gothic Book","Franklin Gothic",helvetica,arial,verdana,sans;
text-decoration:none;
background:#222;
color:#fff;
}
ul#nav ul li a {
padding:10px 15px;
float:left;
}
padding:10px 15px;
float:left;
}
ul#nav li a:hover
,ul#nav li a:focus {
color:#aeff5e;
}
,ul#nav li a:focus {
color:#aeff5e;
}
html body ul.sf-menu ul
,html body ul.sf-menu ul li {
width:180px;
}
html body ul.sf-menu ul ul {
margin:0 0 0 180px;
}
,html body ul.sf-menu ul li {
width:180px;
}
html body ul.sf-menu ul ul {
margin:0 0 0 180px;
}
/* Framework for proper showing/hiding/positioning */
/* DO NOT EDIT FROM HERE */
ul.sf-menu
,ul.sf-menu * {
margin:0;
padding:0;
}
/* DO NOT EDIT FROM HERE */
ul.sf-menu
,ul.sf-menu * {
margin:0;
padding:0;
}
ul.sf-menu {
display:block;
position:relative;
}
ul.sf-menu li {
display:block;
list-style:none;
float:left;
position:relative;
}
ul.sf-menu li:hover {
visibility:inherit; /* fixes IE7 'sticky bug' */
}
ul.sf-menu a {
display:block;
position:relative;
}
ul.sf-menu ul {
position:absolute;
left:0;
width:150px;
top:auto;
left:-999999px;
}
ul.sf-menu ul a {
zoom:1; /* IE6/7 fix */
}
ul.sf-menu ul li {
float:left; /* Must always be floated otherwise there will be a rogue 1px margin-bottom in IE6/7 */
width:150px;
}
ul.sf-menu ul ul {
top:0;
margin:0 0 0 150px
}
display:block;
position:relative;
}
ul.sf-menu li {
display:block;
list-style:none;
float:left;
position:relative;
}
ul.sf-menu li:hover {
visibility:inherit; /* fixes IE7 'sticky bug' */
}
ul.sf-menu a {
display:block;
position:relative;
}
ul.sf-menu ul {
position:absolute;
left:0;
width:150px;
top:auto;
left:-999999px;
}
ul.sf-menu ul a {
zoom:1; /* IE6/7 fix */
}
ul.sf-menu ul li {
float:left; /* Must always be floated otherwise there will be a rogue 1px margin-bottom in IE6/7 */
width:150px;
}
ul.sf-menu ul ul {
top:0;
margin:0 0 0 150px
}
ul.sf-menu li:hover ul,ul.sf-menu li:focus ul,ul.sf-menu li.sf-hover ul { /*first level*/
left:auto;
}
ul.sf-menu li:hover ul ul,ul.sf-menu li:focus ul ul,ul.sf-menu li.sf-hover ul ul {
left:-999999px;
}
ul.sf-menu ul li:hover ul,ul.sf-menu ul li:focus ul,ul.sf-menu ul li.sf-hover ul {/*second level*/
left:auto;
}
ul.sf-menu ul li:hover ul ul,ul.sf-menu ul li:focus ul ul,ul.sf-menu ul li.sf-hover ul ul {
left:-999999px;
}
ul.sf-menu ul ul li:hover ul,ul.sf-menu ul ul li:focus ul,ul.sf-menu ul ul li.sf-hover ul {/*third level*/
left:auto;
}
ul.sf-menu ul ul li:hover ul ul,ul.sf-menu ul ul li:focus ul ul,ul.sf-menu ul ul li.sf-hover ul ul {
left:-999999px;
}
ul.sf-menu ul ul ul li:hover ul,ul.sf-menu ul ul ul li:focus ul,ul.sf-menu ul ul ul li.sf-hover ul {/*fourth level*/
left:auto;
}
ul.sf-menu ul ul ul li:hover ul ul,ul.sf-menu ul ul ul li:focus ul ul,ul.sf-menu ul ul ul li.sf-hover ul ul {
left:-999999px;
}
left:auto;
}
ul.sf-menu li:hover ul ul,ul.sf-menu li:focus ul ul,ul.sf-menu li.sf-hover ul ul {
left:-999999px;
}
ul.sf-menu ul li:hover ul,ul.sf-menu ul li:focus ul,ul.sf-menu ul li.sf-hover ul {/*second level*/
left:auto;
}
ul.sf-menu ul li:hover ul ul,ul.sf-menu ul li:focus ul ul,ul.sf-menu ul li.sf-hover ul ul {
left:-999999px;
}
ul.sf-menu ul ul li:hover ul,ul.sf-menu ul ul li:focus ul,ul.sf-menu ul ul li.sf-hover ul {/*third level*/
left:auto;
}
ul.sf-menu ul ul li:hover ul ul,ul.sf-menu ul ul li:focus ul ul,ul.sf-menu ul ul li.sf-hover ul ul {
left:-999999px;
}
ul.sf-menu ul ul ul li:hover ul,ul.sf-menu ul ul ul li:focus ul,ul.sf-menu ul ul ul li.sf-hover ul {/*fourth level*/
left:auto;
}
ul.sf-menu ul ul ul li:hover ul ul,ul.sf-menu ul ul ul li:focus ul ul,ul.sf-menu ul ul ul li.sf-hover ul ul {
left:-999999px;
}
맨위에 감싸서 넓이를줘도 꿈쩍도안해서..여기저기넣다가 늘어나긴 늘어났는데..
메뉴가 링크보시듯이.. 수직정렬되어있는데..
고칠 방법 없을까요..?
댓글 3개
13년 전
a 의 width를 900으로 주셨네요. ^^;
음.. 원래 코드 http://geeksnowdigital.com/sites/all/modules/SooperFish02/example-advanced.html 에서 검은 부분을 화면 끝까지 채우고 싶으신건가요?
그렇다면, 위 원래 코드에서
ul.nav 의 border 와 border-width를 빼시고,
width: 100%; background-color: #222;
를 넣으시면 될것 같습니다. ^^
음.. 원래 코드 http://geeksnowdigital.com/sites/all/modules/SooperFish02/example-advanced.html 에서 검은 부분을 화면 끝까지 채우고 싶으신건가요?
그렇다면, 위 원래 코드에서
ul.nav 의 border 와 border-width를 빼시고,
width: 100%; background-color: #222;
를 넣으시면 될것 같습니다. ^^
13년 전
감사합니다.. 생각지도못한 ..
13년 전
음
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 530 |
|
19년 전 | 1222 | |
| 529 |
|
19년 전 | 1402 | |
| 528 |
|
19년 전 | 1969 | |
| 527 |
사랑과우정
|
19년 전 | 2384 | |
| 526 | 19년 전 | 2865 | ||
| 525 |
|
19년 전 | 2289 | |
| 524 |
|
19년 전 | 1789 | |
| 523 | 19년 전 | 7026 | ||
| 522 |
|
19년 전 | 3719 | |
| 521 | 19년 전 | 2323 | ||
| 520 | 19년 전 | 2358 | ||
| 519 | 19년 전 | 2848 | ||
| 518 |
|
19년 전 | 5767 | |
| 517 |
|
19년 전 | 5541 | |
| 516 |
|
19년 전 | 2244 | |
| 515 |
|
19년 전 | 3284 | |
| 514 | 19년 전 | 2854 | ||
| 513 | 19년 전 | 2207 | ||
| 512 |
개발자관리자
|
19년 전 | 2721 | |
| 511 |
개발자관리자
|
19년 전 | 1571 | |
| 510 |
개발자관리자
|
19년 전 | 1732 | |
| 509 |
개발자관리자
|
19년 전 | 1826 | |
| 508 |
개발자관리자
|
19년 전 | 1997 | |
| 507 |
개발자관리자
|
19년 전 | 1679 | |
| 506 |
개발자관리자
|
19년 전 | 1798 | |
| 505 |
개발자관리자
|
19년 전 | 1766 | |
| 504 |
개발자관리자
|
19년 전 | 1841 | |
| 503 |
개발자관리자
|
19년 전 | 1513 | |
| 502 |
개발자관리자
|
19년 전 | 2637 | |
| 501 | 19년 전 | 1980 | ||
| 500 | 19년 전 | 3230 | ||
| 499 | 19년 전 | 3255 | ||
| 498 | 19년 전 | 2511 | ||
| 497 | 19년 전 | 2597 | ||
| 496 | 19년 전 | 2433 | ||
| 495 | 19년 전 | 2694 | ||
| 494 | 19년 전 | 2672 | ||
| 493 | 19년 전 | 3161 | ||
| 492 | 19년 전 | 2870 | ||
| 491 | 19년 전 | 5288 | ||
| 490 |
|
19년 전 | 2112 | |
| 489 |
|
19년 전 | 2197 | |
| 488 |
|
19년 전 | 1998 | |
| 487 |
|
19년 전 | 1933 | |
| 486 |
|
19년 전 | 1931 | |
| 485 |
|
19년 전 | 2125 | |
| 484 |
|
19년 전 | 3198 | |
| 483 |
|
19년 전 | 3074 | |
| 482 |
|
19년 전 | 2837 | |
| 481 |
|
19년 전 | 2534 | |
| 480 |
|
19년 전 | 2619 | |
| 479 |
|
19년 전 | 2289 | |
| 478 |
|
19년 전 | 2320 | |
| 477 |
개발자관리자
|
19년 전 | 1579 | |
| 476 |
개발자관리자
|
19년 전 | 2303 | |
| 475 |
개발자관리자
|
19년 전 | 2651 | |
| 474 |
개발자관리자
|
19년 전 | 2646 | |
| 473 |
개발자관리자
|
19년 전 | 2957 | |
| 472 | 19년 전 | 2729 | ||
| 471 | 19년 전 | 1708 | ||
| 470 | 19년 전 | 1809 | ||
| 469 |
|
19년 전 | 2712 | |
| 468 |
|
19년 전 | 2210 | |
| 467 |
|
19년 전 | 3976 | |
| 466 |
|
19년 전 | 2487 | |
| 465 | 19년 전 | 2366 | ||
| 464 | 19년 전 | 3511 | ||
| 463 |
|
19년 전 | 3090 | |
| 462 |
|
19년 전 | 2233 | |
| 461 |
|
19년 전 | 3027 | |
| 460 |
|
19년 전 | 2232 | |
| 459 |
|
19년 전 | 3087 | |
| 458 |
|
19년 전 | 3509 | |
| 457 |
|
19년 전 | 5199 | |
| 456 |
|
19년 전 | 3121 | |
| 455 |
스마일미디어
|
19년 전 | 3118 | |
| 454 |
스마일미디어
|
19년 전 | 2704 | |
| 453 |
스마일미디어
|
19년 전 | 2449 | |
| 452 |
스마일미디어
|
19년 전 | 2707 | |
| 451 |
스마일미디어
|
19년 전 | 2429 | |
| 450 |
스마일미디어
|
19년 전 | 2550 | |
| 449 |
스마일미디어
|
19년 전 | 2349 | |
| 448 |
스마일미디어
|
19년 전 | 2685 | |
| 447 | 19년 전 | 2954 | ||
| 446 |
스마일미디어
|
19년 전 | 3239 | |
| 445 |
스마일미디어
|
19년 전 | 7039 | |
| 444 |
스마일미디어
|
19년 전 | 5163 | |
| 443 |
스마일미디어
|
19년 전 | 2413 | |
| 442 |
스마일미디어
|
19년 전 | 5145 | |
| 441 |
스마일미디어
|
19년 전 | 3087 | |
| 440 |
|
19년 전 | 2440 | |
| 439 | 19년 전 | 2136 | ||
| 438 | 19년 전 | 3562 | ||
| 437 |
|
19년 전 | 2866 | |
| 436 |
|
19년 전 | 3244 | |
| 435 |
|
19년 전 | 2870 | |
| 434 | 19년 전 | 3374 | ||
| 433 |
sjsjin
|
19년 전 | 2699 | |
| 432 |
sjsjin
|
19년 전 | 3447 | |
| 431 |
sjsjin
|
19년 전 | 2409 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기