Не знаю, это глюк или так и должно быть.
Что обнаружил, смещаясь вверх (настройками CSS) главное меню попадает под влияние классов обслуживающих то место куда попадает меню. Хотя физически стоит на своем месте, в позиции Меню.
Мешает работе класс d-flex. В настройках позиции виджета главного меню его нет, но он есть в позиции группы виджетов Лого + меню пользователя
Теоретически можно исключить влияние класса d-flex на главное меню, но как это сделать так и не нашел.
Что подскажите?
Пока даже представить проблему не могу.
Можете почитать в документации bootstrap-4.ru/docs/4.1/utilities/flex/
И на пк сделать выравнивание flex по середине, а на трубе — по верху. И тогда ничего "скакать" не будет.
Попытаюсь скриншотами.
Скриншоты увеличили бы количество ответов.
Пока даже представить проблему не могу.
По умолчанию поле главного Меню находится под Логтипом, в специальном месте сетки виджетов
Я же хочу разместить Главное меню после Логотипа
Для перемещения, с помощью Инстайлера получил код
.navbar-nav{ font-size:18px ; height:23px ; font-weight:bold ; margin-top:-70px ; padding-left: 180px; }
Экспериментально нашел, что причина в классе d-flex из верхнего Ряда "Лого + меню пользователя" То есть, при смещении главного меню к логотипу, оно подпадает под действие настроек этого ряда.
Почему это происходит мне не понятно.
Как и что надо сделать, чтобы при смещении Главного меню вверх к логотипу, меню оставалось функциональным и в мобильном варианте?
Что-то Вы страшное пытаетесь сделать.
Если случайно вызовете дьявола — просто перекреститесь.
Можно еще в настройках колонки, где меню, позицию вывода изменить с "в конце" на " в начале".
Но это, наверное, слишком просто…
Вот просто так "как два пальца об асфальт" — не работает. Вы сами пробовали?
vikont,
Что-то Вы страшное пытаетесь сделать.
Если случайно вызовете дьявола — просто перекреститесь.
Можно еще в настройках колонки, где меню, позицию вывода изменить с "в конце" на " в начале".
Но это, наверное, слишком просто...
Без смещения меню, все работает, хоть вверху хоть внизу. А вот если сместить к Логотипу — НЕ работает.
Не работает даже если сделать 3 — колонки
1. -Логотип
2. — Меню
3. — Персональное меню
Потому, что виджет Меню подпадает под действие класса d-flax
Просто взял и кинул виджет главного меню в колонку к персональному:
Если мешает ди-флекс — уберите его из классов контейнера ряда для ряда Лого + меню пользователя.
Спасибо. Чуть чуть не так, но сделал. У меня над меню, в шапке, еще один виджет с контактами. А с ним так как у вас никак не клеилось....
vikont,
Просто взял и кинул виджет главного меню в колонку к персональному:
Ничего больше не делал.
Если мешает ди-флекс — уберите его из классов контейнера ряда для ряда Лого + меню пользователя.
Под виджетом Логотипа вставил виджет с Контактами и под ним виджет с Меню — так все встало как положено и легко управлялось настройками позиционирования CSS.
Одно странно, почему у меня сразу так не получилось, ведь пробовал..
ПС. Это
делать проблемно, так как шапка полностью разваливается.Если мешает ди-флекс — уберите его из классов контейнера ряда для ряда Лого + меню пользователя.
ПС (Для Fuze) — Очень уж чувствительно Мобильное меню к положению главного меню в декстопе! Отображение обоих меню слишком привязано друг с другом и в итоге Мобильное меню получается не юзабельным. В этом отношении мобильное меню шаблона Smart от Evanescence более дружественное к пользователю и удобнее. На сегодняшний день, идет резкий рост пользователей с мобильными устройствами и нам это приходится учитывать.
Я разобрался со своей проблемой, но в итоге поставил шаблон Smart, хотя он несколько тормознутее Moderna а хотелось бы использовать Modernа. Modernу не хватает чисто мобильных фишек. Видел интересные и у Олега Васильевиа я. Если они оба поделятся наработками и вы согласитесь их встроить в Modern, Инстант только выиграет.
Просил Evanescence доработать Smart под новый шаблон, но он считает это не целесобразным. Возможно он прав, есть мощный Modern, но без мобильных фишек.
goodmade.ru/instantcms2/242-shablon-mobilnogo-menyu.html
Таким же образом можно подключить любое другое моб. меню, сделав отдельный шаблон меню. И просто привязать его к клику по кнопке.
Спасибо, Денис, но речь шла не только о самом меню, а еще о некоторых фишках Для удобства пользования и улучшения поведенческого фактора. Работая с мобильного устройства, пользователь привыкает возможности напрямик кликнуть на вызов по телефону или через мессенджер и кнопочки должны быть под рукой и даже мотивировать к звонку или заказу.
Если говорить о гавном мобильном меню
goodmade.ru/instantcms2/242-shablon-mobilnogo-menyu.html
Таким же образом можно подключить любое другое моб. меню, сделав отдельный шаблон меню. И просто привязать его к клику по кнопке.
Ваша ошибка в том, что Вы пытаетесь с элементами flexbox работать методами css2. Отсюда результат.
Почитайте про флекс, почитайте про бутстрап:
html5book.ru/css3-flexbox/
bootstrap-4.ru/docs/4.0/utilities/flex/
Сделайте файл html, нарисуйте в нем квадратов и двигайте их, тренируйтесь. Можно бутстрап в этот файл подключить.
Даже никаких опенсерверов не нужно — оно в браузере работает.