Помогите с выпадающей менюшкой), плиз

Valeriy
На сайте с 19.04.2007
Offline
110
496

Движок InstantCMS, есть один шаблон, там сделана менюшка с подразделами.

Проблема в том, между выпадающим списком и меню остается зазор - и при переходе на подразделы они пропадают. нужно делать весьма резкое движение.

Как устранить это?

вот так это выглядит

А это стили

#topmenu{
overflow:hidden;
margin-top:10px;
margin-bottom:20px;
background:url(../images/menubg.jpg) repeat-x;
border-radius:6px;
-moz-border-radius:6px;
height: 33px;
line-height: 33px;
margin-left: 10px;
margin-right: 10px;
padding-left: 10px;
}

#topmenu .menu{ list-style:none; margin:0; padding:0; }
#topmenu .menu li a{ text-decoration:none; }
#topmenu .menu li{
list-style:none;
margin:0;
padding:-5;
height:33px;
line-height:33px;
display:inline-block;
//display: inline;
zoom: 1;
font-size:18px;
//position: relative;
}

#topmenu .menu li.selected{
background:url(../images/menubg.jpg) repeat-x left top #375E93;
}

#topmenu .menu li.selected a.selected{
color:#fff;
text-decoration:none;
text-shadow:0 1px 0 #000;
}

#topmenu .menu li a:hover,
#topmenu .menu li a.hover{
background:url(../images/menubg-hover.jpg) repeat-x center top #375E93;
color:#000 !important;
text-shadow:0 1px 0px #FFF !important;
}

#topmenu .menu li a{
padding:0px 10px;
color:#fff;
height:33px;
line-height:33px;
display:inline-block;
text-shadow:0 1px 0px #000 !important;
}

#topmenu ul li ul {
display:none;
position: absolute;
top: 227px;
//top:33px;
//left:0;
width: 200px;
background: #3a464e;
color: #FFF;
padding:0px;
z-index:1000;
box-shadow:1px 1px 3px #000;
-moz-box-shadow:1px 1px 3px #000;
}
#topmenu ul li ul li ul {
display:none;
position: relative;
margin-top:-155px;
left:200px;
width: 200px;
background: #3a464e;
color: #000;
padding:0px;
z-index:1000;
box-shadow:1px 1px 3px #000;
-moz-box-shadow:1px 1px 3px #000;
}

#topmenu ul li ul li, #topmenu ul li ul li a{
display:block;
width:100%;
}

#topmenu ul li ul li a{
padding:0px !important;
text-decoration:none;
}
#topmenu ul li ul li a span{
margin:0px 10px;
padding:0px;
}

#topmenu ul li ul li a.selected span{
text-decoration:none;
}
[Удален]
#1

Попробуйте margin-top: с минусовым значением

Valeriy
На сайте с 19.04.2007
Offline
110
#2
igor3333:
Попробуйте margi-top: с минусовым значением

Чуть конкретнее можно? Где там?

(Все, что знал, забыл...)

[Удален]
#3

Для блока с выподающим меню (тот где написано Социум ,Семья) добавте в стиле margin-top:-5px;

Если можно ссылку на сайт

C
На сайте с 04.02.2005
Offline
291
#4

скорей всего

нужно вот здесь поиграться top

#topmenu ul li ul {

display:none;

position: absolute;

top: 227px;

//top:33px;

//left:0;

width: 200px;

background: #3a464e;

color: #FFF;

padding:0px;

z-index:1000;

box-shadow:1px 1px 3px #000;

-moz-box-shadow:1px 1px 3px #000;

}

Valeriy
На сайте с 19.04.2007
Offline
110
#5
igor3333:
Для блока с выподающим меню

Знал бы, в какое место:)

http://www.ivatsevichy.by/

[Удален]
#6

в файле http://www.ivatsevichy.by/templates/news/css/styles.css

163 строка будет такой кусок со стилями

#topmenu ul li ul {

background: none repeat scroll 0 0 #3A464E;

box-shadow: 1px 1px 3px #000000;

color: #FFFFFF;

display: none;

padding: 0;

position: absolute;

top: 227px;

width: 200px;

z-index: 1000;

}

убирите top: 227px;

Valeriy
На сайте с 19.04.2007
Offline
110
#7

Chukcha, есть, спасибо!

---------- Добавлено 06.12.2012 в 12:20 ----------

igor3333, да, именно это

[Удален]
#8

:) :) :) :)

RO
На сайте с 13.07.2009
Offline
88
#9

для решения проблем такого типа юзайте оpera dragonfly или firebug под firefox. сразу же на живом сайте можно править как верстку так и стили.

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий