Question

Друзья! приветствую Всех!)

Вопрос такого харкатера. Работаю с шаблоном #1221. На текущий момент сделал меню сайта таким образом, чтобы оно было зафиксировано вверху и при прокрутке страницы оставалось на месте, для лучшей навигации по сайту. 

Но столкнулся с такой проблемой, что не могу подобрать ширину блока меню и зафиксировать его. Выставил параметр width: 978px, max-width: 978px, но всё равно, например при смене масштаба сайта, блок съезжает куда то и смотрится не качественно. Не могу понять в чём я ошибся.

Привожу пример на скрине:

Как видно блок съехал при небольшой смене масштаба.

На текущий момент я внёс следующий код в блок /* Menus */ (132 строка шаблона):

.menu-wrap {
 width: 900px;
 max-width: 978px;
 top:0; 
 position:fixed; 
 z-index: 5; 
 overflow: visible;

 

Помогите пожалуйста, что я сделал не так?!

Заранее огромное спасибо

Answer 1

Пропишите в стили:

@media screen and (min-width: 700px) and (max-width: 979px) {
 .menu-wrap {
 width:748px!important;
 max-width: 748px!important; 
 }}

Answer 2

<div class="menu-outer">

<div class="menu-wrap"></div>

</div>

 .menu-outer {position:fixed;top:0;left:0;width: 100%}

.menu-wrap {max-width: 1000px;margin: 0 auto;}