Question

версии сайта!  Меню и логотип, после внесенных мной изменений, оказались по середине. Мне хотелось бы сделать так, чтобы меню располагалось в самом верху, в одну строку . Можно ли сделать так, чтобы логотип отображался лишь в мобильной версии сайта!?  Пожалуйста ответьте, как можно исправить ситуацию.

Answer 1

Даже если скрыть логотип и отображать лишь для мобильных, меню от этого шире не станет. Вам нужно сократить название пунктов меню. То есть есть у вас Главная страница - Главная (сделайте кратко), далее есть Гостевая книга - Гостевая, далее есть Обратная связь - Контакты.

Далее в стилях найти строку 30:

#catmenu{float:right;width: 69%;text-align:right;padding:12px 0 0;}

замените на:

#catmenu{width: 100%;text-align:right;padding:12px 0 0;}

Далее в стилях в строке 34 найти стили:

#catmenu li a{position:relative; font-size:24px; text-transform:uppercase; padding:0; color:#FFFFFF}

размер шрифта 24 измените на 17.

И последнее, чтобы логотип скрывать на мобильных, в стили пропишите в самый низ:

@media screen and (min-width: 240px) and (max-width: 650px) { #site-logo { display:none; } 

Comments

Спасибо Вам за все Ваши ответы! За креативность мышления! На самом деле, краткость - сестра таланта. С заменной пунктов меню на более короткие мне удалось разместить все меню в одну строку.  На самом деле мне хотелось, что бы шрифт был больше, чем 17 и чтобы само меню было в самом верху страницы, а оно продолжает находиться посередине. ((  Разместить меню по вертикали (чтобы хотя бы понять какой из вариантов лучше!) мне также не удается! Оно намертво стоит на месте. (  После внесенных изменений @media screen and (min-width: 240px) and (max-width: 650px) { #site-logo { display:none; }  Я вижу в мобильной версии сайта и фон, и логотип! А хотела бы ПОКАЗЫВАТЬ ЛОГОТИП ТОЛЬКО В МОБИЛЬНОЙ версии и СКРЫТЬ логотип в версии сайта, которую мы видим с ноутбука.

---

Приблизительно как здесь! Где фото журналиста и меню находятся в самом верху страницы. Дальше, крупным планом фото одного из его фоторепортажей...

---

вам надо или сменить шаблон и выбрать из бесплатной коллекции из новых или заказывать тут https://upartner.pro/ на этом сайте не выполняются глобальные изменения шаблонов. если надумаете искать в бесплатной коллекции, сначала сделайте бекап шаблонов. делается это в панели управления - дизайн - бекап (или резервная копия) шаблона

---

Elena Rostovtseva,

В стили установили с ошибками, хотя я дал праивльно и объяснил где вставить. В самом низу таблицы стилей найдите следующие стили:

#top .uMenuRoot li {font-size: 40px;
@media screen and (min-width: 240px) and (max-width: 650px) { #site-logo { display:none; } 

замените их на:

#top .uMenuRoot li {font-size: 40px; }
@media screen and (min-width: 240px) and (max-width: 950px) { #site-logo { display:none; }#header {background:transparent;} }

---

Юрий! Я все перепроверила. Я сделала все именно так, как Вы мне написали. И сделала последнюю замену также. В последние 578 и 579 строки я прописала #top .uMenuRoot li {font-size: 40px; }
@media screen and (min-width: 240px) and (max-width: 950px) { #site-logo { display:none; }#header {background:transparent;} }

Но ничего не меняется. Я не знаю почему. Единственное, что я заметила, что #catmenu{width: 100%;text-align:right;padding:12px 0 0;} находится на 29 строке, а на 30 строке #catmenu .nav-head, .eBlock+br{display:none} Вы пишете мне заменить именно 30 строку.

Спасибо за ваши ответы, но, видимо, что-то не так с моим исполнением...

---

Спасибо! Буду пытаться достигнуть какой-то гармонии в дизайне теми способами, которые вы мне рекомендуете..