#wordpress #menubar
#wordpress #панель меню
Вопрос:
Всякий раз, когда ширина браузера уменьшается от максимальной, элементы строки меню перекрывают логотип. По мере дальнейшего уменьшения ширины браузера строка меню исчезает, прежде чем снова появиться в виде выпадающего меню. Можно ли сделать так, чтобы строка меню не перекрывала логотип сайта при изменении размера? И есть ли способ гарантировать, что строка меню остается видимой без пробелов при переходе из меню в выпадающее меню?
Тема расширена. http://themeforest.net/item/enfold-responsive-multipurpose-theme/4519990
Комментарии:
1. Использует ли ваш сайт дочернюю тему, и если да, используете ли вы последнюю версию Enfold? Они регулярно обновляются.
2. Сайт по предоставленной вами ссылке, похоже, значительно отличается от примера на themeforest в отношении того, как функционирует меню. Вы вносили изменения?
Ответ №1:
Я сталкивался с этим с помощью Enfold несколько раз.
Я обычно использую медиа-запросы CSS для изменения соответствующей комбинации отступов между пунктами меню, интервалов между буквами и размера шрифта, чтобы вы могли уменьшить ширину экрана без перекрытия. Если у меня много элементов в меню, а у вас меньше места для игры, я обычно также изменяю настройки мобильного меню в настройках темы, чтобы они были разбиты на 989 пикселей вместо 768 пикселей (в последней версии темы это находится в разделе «Обложка»> «Главное меню»> «Пункты меню для мобильных устройств»).
Необходимый вам CSS будет примерно таким:
@media only screen and (max-width: 1200px) {
.av-main-nav > .menu-item > a {
padding: 0 7px;
}
.av-main-nav > .menu-item > a .avia-menu-text {
font-size: 12px;
letter-spacing: -1px;
}
}
@media only screen and (max-width: 1000px {
...etc
Не уверен, почему он исчезает на любом этапе. Нужно будет просмотреть сайт, чтобы воспроизвести его. Сайт, который вы опубликовали, является сайтом Shopify.