Помогите разобраться с кодом и установить навигацию

На скине все видно, куда я хочу поставить кнопки навигации, и где она находится.

Только у меня проблема с кодом css - сейчас навигация вообще исчезла

Вот отрывок кода, отвечающий за меню:

Код:

.mainmenu {
margin-bottom: 80px;
margin-right:12px;
display:inline-block;
height:42px;
overflow:hidden;
vertical-align: top;
}


.mainmenu {
display:inline-block;
height:-42px;
overflow:hidden;
vertical-align: top;

display:-moz-inline-stack;
zoom:1;
*display:inline;
_overflow:hidden;


}
a.mainmenu img {
margin-top:100px;
}
a.mainmenu img:hover{
margin-top: -42px;
}

Что нужно добавить/удалить чтобы расположить навигацию там, где я указала?

PS. еще здесь стоит код изменения картинки при наведении, можно ли его убрать, и заменить на прозрачность? (при наведении)

Заранее

А вот такие кнопки вам подойдут? https://help.forum2x2.ru/t16763-topic
Можно еще скрыть все кнопки и вставить картинки, по клику на которые вы будете переходить на нужные страницы.

нет, это уже подменю, а мне нужно навигацию обычную)
просто я не знаю, из-за чего она скрыта - т.е. мне надо вернуть ее на форум (чтобы отображалась вообще) и установить на указанное место..)

Для анимации с прозрачностью при наведении двойные картинки не нужны. Я правильно понимаю, что Вам нужно меню из одинарных картинок, или вообще текстовое?

P.S. вот это надо убрать:

Код:

a.mainmenu img {
margin-top:100px;
}
a.mainmenu img:hover{
margin-top: -42px;
}

а это добавить:

Код:

a.mainmenu {
    position:relative;
    top: 100px;
    }

#page-body {
    padding-top: 100px;
    }

да, я это знаю) просто до этого у меня стояли двойные - верхняя из которых прозрачнее)

ДА, все правильно, мне нужно меню из одинарных картинок, в указанном месте.

Спасибо, Dana!
Только теперь походу еще один вопрос появился - как вот этот огромный пропуск убрать?

PS. ну и код для прозрачности, если можно)

Вот тут

#page-body {
padding-top: 100px;
}

подберите число поменьше.

спасибо, все получилось! =)

А для изменения прозрачности при наведении добавьте:

Код:

a.mainmenu:hover {
    opacity: 0.5;
    filter: alpha(opacity=50);
    }

Спасибо!
но только я опять накосячила слегка - сделала для всех ссылок пунктирное подчеркивание при наведении, но из-за этого теперь и кнопки подчеркиваются =( как исправить?

Не помогает =(

Может что-то не так с кодом?

Навигация:

Код:

.mainmenu {
margin-bottom: 80px;
margin-right:12px;
display:inline-block;
height:42px;
overflow:hidden;
vertical-align: top;
}


.mainmenu {
display:inline-block;
height:-42px;
overflow:hidden;
vertical-align: top;

display:-moz-inline-stack;
zoom:1;
*display:inline;
_overflow:hidden;
}

a.mainmenu {
    position:relative;
    top: 100px;
    }

a.mainmenu:hover {
opacity: 0.5;
filter: alpha(opacity=50);
text-decoration: none !important;
}

#page-body {
    padding-top: 40px;
    }

ссылки:

Код:

/*оформление ссылок*/

pan.postdetails.poster-profile a{
text-decoration: none !important;
}
span.postdetails.poster-profile a:hover{
font-weight:700;
}
table.forumline span.gensmall strong{
font-weight: normal;
}
table.forumline span.gensmall b a.gensmall{
font-weight: normal;
}
a:hover{/*При наведении*/
font-weight:700 !important;/*ставали жирными*/
color: #0e5f14 !important;/*меняли цвет*/
text-decoration: none !important;/* Убираем обычное подчеркивание */
border-bottom: 1px dashed green /* Добавляем пунктирную линию под текстом */
}
table.forumline span.gensmall a{
text-decoration: none !important;
}

#page-footer a{
font-weight: 100 !important;
text-decoration: none !important;
}

Добавьте в самый низ, так эти настройки станут "более приоритетными":

Код:

a.mainmenu:hover {
text-decoration: none !important;
border: none !important;
}

Спасибо большое, все вышло!)