|
помогите плиз с CSSОбсуждение темы помогите плиз с CSS в разделе HTML, CSS, JavaScript, часть категории ВЕБ-ПРОГРАММИРОВАНИЕ; Друзъя! Я не большой спец в CSS... поимел шаблон для джумлы и хочу немного исправить верхнее меню. Вот как это выглядит на главной: ... |
|
Опции темы |
27.03.2009, 00:09 | #1 |
|
Друзъя!
Я не большой спец в CSS... поимел шаблон для джумлы и хочу немного исправить верхнее меню. Вот как это выглядит на главной: hxxp://limerick.su/ (вроде все красиво) Но если пойти по страницам (например вот тут: hххp://limerick.su/index.php?option=com_community&view=frontpage&Item id=53) то стили съежжают... Еще больше они съежают вот тут (hххp://limerick.su/index.php?option=com_content&view=article&id=43&It emid=43) Вот как выглядит css для этого меню Код:
#tp-cssmenu { margin: 0; /* all lists */ padding: 0; float: left; background:url(../images/style1/bgactivemenu_b.png) no-repeat top right ; } #tp-cssmenu ul { margin: 0; /* all lists */ padding: 0; } #tp-cssmenu li { margin: 0; /* all list items */ padding: 0 0 0 0; float: left; display: block; background: none; cursor: pointer; position: relative; z-index:100000; /*background:url(../images/style1/bgactivemenu_c.png) no-repeat top left;*/ } #tp-cssmenu li ul { width: 14em; position: absolute; /* second-level lists */ z-index: 9999999; height: auto; /* width: 15.9em; */ margin-top:0; margin-left:-2px; padding:0 0 0 0; border-right:1px solid #30316a; border-bottom:1px solid #30316a; border-left:1px solid #30316a; } #tp-cssmenu ul ul { margin: -2.3em 0 0 14em; /* third-and-above-level lists */ padding-bottom:0; background-image:none; padding:0 0 0 0; } #tp-cssmenu li li { padding: 0 0 0 0; margin: 0; width: 14em; } #tp-cssmenu ul a { } #tp-cssmenu li ul { left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */ } #tp-cssmenu li:hover ul ul, #tp-cssmenu li:hover ul ul ul, #tp-cssmenu li:hover ul ul ul ul, #tp-cssmenu li.sfhover ul ul, #tp-cssmenu li.havechildsfhover ul ul, #tp-cssmenu li.havechild-activesfhover ul ul, #tp-cssmenu li.activesfhover ul ul, #tp-cssmenu li.sfhover ul ul ul, #tp-cssmenu li.havechildsfhover ul ul ul, #tp-cssmenu li.havechild-activesfhover ul ul ul, #tp-cssmenu li.activesfhover ul ul ul, #tp-cssmenu li.sfhover ul ul ul ul, #tp-cssmenu li.havechildsfhover ul ul ul ul, #tp-cssmenu li.havechild-activesfhover ul ul ul ul, #tp-cssmenu li.activesfhover ul ul ul ul { left: -999em; } /* This "unhides" the sub-menus (left: -999em is what hides them) */ #tp-cssmenu li:hover ul, #tp-cssmenu li li:hover ul, #tp-cssmenu li li li:hover ul, #tp-cssmenu li li li li:hover ul, #tp-cssmenu li.sfhover ul, #tp-cssmenu li.havechildsfhover ul, #tp-cssmenu li.havechild-activesfhover ul, #tp-cssmenu li.activesfhover ul, #tp-cssmenu li li.sfhover ul, #tp-cssmenu li li.havesubchildsfhover ul, #tp-cssmenu li li.havesubchild-activesfhover ul, #tp-cssmenu li li.activesfhover ul, #tp-cssmenu li li li.sfhover ul, #tp-cssmenu li li li.havesubchildsfhover ul, #tp-cssmenu li li li.havesubchild-activesfhover ul, #tp-cssmenu li li li.activesfhover ul, #tp-cssmenu li li li li.sfhover ul, #tp-cssmenu li li li li.havesubchildsfhover ul, #tp-cssmenu li li li li.havesubchild-activesfhover ul, #tp-cssmenu li li li li.activesfhover ul { left: auto; } /* STYLING THE MENU -----------------------------------*/ /* 1st level */ #tp-cssmenu li a { margin: 0; padding: 0 10px 0 10px; display: block; font-weight:700; text-decoration: none; text-align:left; font-family:arial; font-size:14px; height:68px; line-height:30px; text-transform:uppercase; letter-spacing:-1px; color:#FFFFFF; } #tp-cssmenu li.active a { background:url(../images/style1/bgactivemenu_a.png) no-repeat top right ; line-height:30px; height:68px; display: block; color:#fd2904; } #tp-cssmenu li li a { letter-spacing:0; line-height:24px;} #tp-cssmenu li ul li a { height: auto; line-height: 24px; padding-left:15px; font-size:11px; font-weight:400; } #tp-cssmenu li ul li li a { line-height: 24px; padding-left:15px; font-weight:400; } #tp-cssmenu li li a { border-right:none; color:#fd2904; font-weight:700; } #tp-cssmenu li a:hover, #tp-cssmenu li a:active, #tp-cssmenu li a:focus, #tp-cssmenu li li a:hover { background:url(../images/style1/bgactivemenu_a.png) no-repeat top right ; color: #fd2904; } #tp-cssmenu li.active a, #tp-cssmenu li.active a:hover, #tp-cssmenu li a.active:active, #tp-cssmenu li a.active:focus { color: #fd2904;} #tp-cssmenu li li a:hover, #tp-cssmenu li li a:active, #tp-cssmenu li li a:focus, #tp-cssmenu li li li a:hover, #tp-cssmenu li li a.active, #tp-cssmenu li li a.active:hover, #tp-cssmenu li li a.active:active, #tp-cssmenu li li a.active:focus { color: #fff; } #tp-cssmenu li.fulltpmenuimages img, #tp-cssmenu li.fulltpmenuimagessfhover img, #tp-cssmenu li a.fulltpmenuimages, #tp-cssmenu li.fulltpmenuimages a, #tp-cssmenu li.fulltpmenuimagessfhover a, #tp-cssmenu li.tpmenutextandimage a, #tp-cssmenu li.tpmenutextandimagesfhover a { padding:0 10px 0 10px; margin:0; line-height:24px; border-right:none; } #tp-cssmenu li.tpmenutextandimage li a { padding-left:10px; padding-right:0; color:#fff;} #tp-cssmenu li.tpmenutextandimagesfhover li a:hover { padding-left:10px; padding-right:0; color:#fff; } #tp-cssmenu li.tpmenutextandimage li, #tp-cssmenu li.tpmenutextandimagesfhover li { padding:0; } #tp-cssmenu li.tpmenutextandimage img, #tp-cssmenu li.tpmenutextandimagesfhover img { vertical-align:middle; } #tp-cssmenu li.fulltpmenuimages ul li a, #tp-cssmenu li.fulltpmenuimagessfhover ul li a { padding-left:10px;} #tp-cssmenu li.fulltpmenuimages a { padding:0; margin:0;} .tpmenutextandimage img, .tpmenutextandimagesfhover img{ display: block; padding-top:10px;} .fulltpmenuimageschild {} .tpmenutextandimagechild {} #tp-cssmenu li a.fulltpmenuimages { padding:0; margin:0;} #tp-cssmenu li ul li.active {} #tp-cssmenu li.parent a{} #tp-cssmenu li.parent a:active { color: #fff; } #tp-cssmenu li ul li.parent a.haschild , #tp-cssmenu li ul li.parentsfhover a.haschild, #tp-cssmenu li ul li.parent li.parent a.haschild , #tp-cssmenu li ul li.parentsfhover li.parentsfhover li a.haschild, #tp-cssmenu li ul li.parent li.parent li.parent a.haschild , #tp-cssmenu li ul li.parentsfhover li.parentsfhover li.parentsfhover li a.haschild{ background: url(../images/tpmenuright.gif) right top no-repeat; color: #fff; } #tp-cssmenu li.parentsfhover li, #tp-cssmenu li.active li.parentsfhover, #tp-cssmenu li.parent li , #tp-cssmenu li.active li , #tp-cssmenu li.active li li { background:#0e1039; /*border-top:1px solid #DDDBDB;*/ color: #fff; height:24px; line-height:24px; } #tp-cssmenu li ul li.parentsfhover, #tp-cssmenu li.active ul li.parentsfhover , #tp-cssmenu li.parent li.parent:hover { background:url(../images/bgmenuhover.gif); } #tp-cssmenu li.active { background:url(../images/style1/bgactivemenu.png) no-repeat top left; padding-left:2px; } #tp-cssmenu li li.active { padding-left:0;} #tp-cssmenu li.activesfhover:hover { background:#13144d; color:#fff;} #tp-cssmenu li.activesfhover:hover span, #tp-cssmenu li.activesfhover:hover a { color:#fff;} #tp-cssmenu li li.activesfhover a { background:none;} #tp-cssmenu li.active li a { line-height: 24px; background:none;} #tp-cssmenu li:hover, #tp-cssmenu li.sfhover, #tp-cssmenu li.havechildsfhover, #tp-cssmenu li.havechild-activesfhover { color: #877D7D; } #tp-cssmenu li:hover a { } /* 2nd level and above */ #tp-cssmenu li ul a { margin: 0; text-transform: none; } #tp-cssmenu li.havesubchild, #tp-cssmenu li.havesubchild-active { } #tp-cssmenu li ul a:hover, #tp-cssmenu li ul a:active, #tp-cssmenu li ul a:focus, #tp-cssmenu li.parent li ul a:hover, #tp-cssmenu li.parent li ul a:active, #tp-cssmenu li.parent li ul a:focus { color: #fff; background: /*url(../images/bgmenuhover.gif)*/ #13144d repeat-x; } /*#tp-cssmenu ul li.active, #tp-cssmenu ul li li.active, #tp-cssmenu ul li li li.active, #tp-cssmenu ul li li li li.active { color: #fff; background: /*url(../images/bgmenuhover.gif)*/ #13144d repeat-x; } #tp-cssmenu ul li a.active , #tp-cssmenu ul li li a.active , #tp-cssmenu ul li li li a.active , #tp-cssmenu ul li li li li a.active { color:#ccc;}*/ #tp-cssmenu li.active ul li a:hover { color:#fff; } .tpsubtitle { display:block; font-size:9px; margin:0; padding:0; font-weight:400; height:11px; line-height:9px; margin-top:-5px; color:#fff; text-transform:uppercase; font-family:Verdana, Arial, Helvetica, sans-serif; letter-spacing:-1px; } #tp-cssmenu li.active li a { height:24px; line-height:24px; } #tp-cssmenu li.active span.tpsubtitle { color:#fff;} Если кто подскажет, где копать хотябы, чтобы на всех страницах было одинаково... какие конструкции? Заранее спасибо! |
|
27.03.2009, 00:36 | #2 |
|
что именно "сьезжает"? посмотрел... не заметил ничего...
|
|
27.03.2009, 02:50 | #3 |
|
самое врехнее меню: Главная Сообщество - выпадающие элементы не выравниваются как надо на разных страницах и пропадают бордюры между пунктами меню... приложил картинку для понятности
Последний раз редактировалось M.C.; 27.03.2009 в 03:00.. |
|
|
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
Помогите! Плиз! | s_kotsaga | Резюме | 9 | 06.05.2011 14:11 |
Помогите плиз! | bum | Растровая графика | 2 | 26.03.2008 05:44 |
Ребята, помогите плиз | Давыд | Векторный арт | 2 | 19.06.2007 13:25 |
помогите с предзагрузчиком, плиз+ | kot | Технологии Flash | 4 | 07.12.2005 13:49 |
Реклама на форуме
Условия размещения рекламы
Биржа ссылок
Заработай на сайте!
|