Перейти к содержимому


Проблемы С Адаптивной Частью

Автор Sergey1988, 23 марта 2019 08:21
адаптивная часть

  • Авторизуйтесь для ответа в теме
Сообщений в теме: 10

#1 Sergey1988

Sergey1988

    Пользователь

  • Пользователи
  • PipPip
  • 35 сообщений

Отправлено 23 Март 2019 - 08:21

Здравствуйте, второй раз прошу о помощи. Проблема в адаптивной части- строка поиска накладывается на логотип.косяк.png

#2 metry

metry

    Активный участник

  • Модераторы
  • 884 сообщений

Отправлено 23 Март 2019 - 12:35

Добрый день. Отображение Вам исправили. Пожалуйста, проверьте, очистив кэш браузера: CTRL+F5

#3 Sergey1988

Sergey1988

    Пользователь

  • Пользователи
  • PipPip
  • 35 сообщений

Отправлено 25 Март 2019 - 15:12

Просмотр сообщенияmetry (23 Март 2019 - 12:35) писал:

Добрый день. Отображение Вам исправили. Пожалуйста, проверьте, очистив кэш браузера: CTRL+F5
Добрый день!спасибо большое, одной проблемой стало меньше, но не совсем все,как хотелось бы. Можно ли сделать так, как я указал на скриншоте?
косяк.png
1. Сдвинуть якорь на левый фланг.
2. Меню перебросить выше
3. На появившуюся свободную зону сдвинуть банер
4. Минимальную сумму заказа отцентрировать
5. Всплывающее меню прячется за "суммой заказа"
6. Это меню в принципе всплывает не там,где его можно увидеть)
Спасибо!))

#4 Sergey1988

Sergey1988

    Пользователь

  • Пользователи
  • PipPip
  • 35 сообщений

Отправлено 25 Март 2019 - 15:35

Такой вот результат хотелось бы)косяк.png

#5 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 04 Апрель 2019 - 08:56

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
#header-top .topheader-right .sns-quickaccess ul.links {overflow:visible;height:auto;position: absolute;top: 35px;left: -114px;background: transparent;width: 160px;padding: 10px 0 0;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);transform-origin: 50% 10% 0;-moz-transform-origin: 50% 10% 0;-webkit-transform-origin: 50% 10% 0;-o-transform-origin: 50% 10% 0;-ms-transform-origin: 50% 10% 0;margin: 0 0;padding: 0 0;border: none;background: #FFF;border: 1px solid #e9e9e9;}

замените на:
#header-top .topheader-right .sns-quickaccess ul.links {overflow:visible;height:auto;position: absolute;top: 35px;left: 0;background: transparent;width: 160px;padding: 10px 0 0;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);transform-origin: 50% 10% 0;-moz-transform-origin: 50% 10% 0;-webkit-transform-origin: 50% 10% 0;-o-transform-origin: 50% 10% 0;-ms-transform-origin: 50% 10% 0;margin: 0 0;padding: 0 0;border: none;background: #FFF;border: 1px solid #e9e9e9;}


далее найдите:
#custommenu {display: none;}
#mommenu {display: block;}

замените на:
#custommenu {display: none;}
#mommenu {display: block;height: 0px;overflow: visible;}
#mommenu .btn {position: absolute; left:0;top:-115px;background: #fff;}
.mini-cart {position: absolute; right: 10px; top: -55px;}
#slideshow:before {display: none;}

далее найдите:
#header .sum{float:left;position: absolute;top: 55px;z-index: 11;right: 14px;background-color: #fff;border-radius: 30px;}

замените на:
#header .sum{float:left;position: absolute;top: 55px;z-index: 11;right: 0;background-color: #fff;border-radius: 30px;left: 0;text-align: center;}

далее найдите:
#header-top .topheader-left ul.contact-us-now {position: absolute;top: 35px;left: -1px;width: 200px;border: 1px solid #e9e9e9;background: #FFF;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);}

замените на:
#header-top .topheader-left ul.contact-us-now {position: absolute;top: 35px;right: 0;width: 200px;border: 1px solid #e9e9e9;background: #FFF;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);}

#6 Sergey1988

Sergey1988

    Пользователь

  • Пользователи
  • PipPip
  • 35 сообщений

Отправлено 04 Апрель 2019 - 09:19

Просмотр сообщенияVaccina (04 Апрель 2019 - 08:56) писал:

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
#header-top .topheader-right .sns-quickaccess ul.links {overflow:visible;height:auto;position: absolute;top: 35px;left: -114px;background: transparent;width: 160px;padding: 10px 0 0;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);transform-origin: 50% 10% 0;-moz-transform-origin: 50% 10% 0;-webkit-transform-origin: 50% 10% 0;-o-transform-origin: 50% 10% 0;-ms-transform-origin: 50% 10% 0;margin: 0 0;padding: 0 0;border: none;background: #FFF;border: 1px solid #e9e9e9;}

замените на:
#header-top .topheader-right .sns-quickaccess ul.links {overflow:visible;height:auto;position: absolute;top: 35px;left: 0;background: transparent;width: 160px;padding: 10px 0 0;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);transform-origin: 50% 10% 0;-moz-transform-origin: 50% 10% 0;-webkit-transform-origin: 50% 10% 0;-o-transform-origin: 50% 10% 0;-ms-transform-origin: 50% 10% 0;margin: 0 0;padding: 0 0;border: none;background: #FFF;border: 1px solid #e9e9e9;}


далее найдите:
#custommenu {display: none;}
#mommenu {display: block;}

замените на:
#custommenu {display: none;}
#mommenu {display: block;height: 0px;overflow: visible;}
#mommenu .btn {position: absolute; left:0;top:-115px;background: #fff;}
.mini-cart {position: absolute; right: 10px; top: -55px;}
#slideshow:before {display: none;}

далее найдите:
#header .sum{float:left;position: absolute;top: 55px;z-index: 11;right: 14px;background-color: #fff;border-radius: 30px;}

замените на:
#header .sum{float:left;position: absolute;top: 55px;z-index: 11;right: 0;background-color: #fff;border-radius: 30px;left: 0;text-align: center;}

далее найдите:
#header-top .topheader-left ul.contact-us-now {position: absolute;top: 35px;left: -1px;width: 200px;border: 1px solid #e9e9e9;background: #FFF;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);}

замените на:
#header-top .topheader-left ul.contact-us-now {position: absolute;top: 35px;right: 0;width: 200px;border: 1px solid #e9e9e9;background: #FFF;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);}
Спасибо огромное за Ваш труд. Почти все получилось- левое верхнее меню при разворачивании заходит за значок основного меню и надпись "минимальный заказ...."

#7 Sergey1988

Sergey1988

    Пользователь

  • Пользователи
  • PipPip
  • 35 сообщений

Отправлено 04 Апрель 2019 - 09:37

Просмотр сообщенияVaccina (04 Апрель 2019 - 08:56) писал:

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
#header-top .topheader-right .sns-quickaccess ul.links {overflow:visible;height:auto;position: absolute;top: 35px;left: -114px;background: transparent;width: 160px;padding: 10px 0 0;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);transform-origin: 50% 10% 0;-moz-transform-origin: 50% 10% 0;-webkit-transform-origin: 50% 10% 0;-o-transform-origin: 50% 10% 0;-ms-transform-origin: 50% 10% 0;margin: 0 0;padding: 0 0;border: none;background: #FFF;border: 1px solid #e9e9e9;}

замените на:
#header-top .topheader-right .sns-quickaccess ul.links {overflow:visible;height:auto;position: absolute;top: 35px;left: 0;background: transparent;width: 160px;padding: 10px 0 0;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);transform-origin: 50% 10% 0;-moz-transform-origin: 50% 10% 0;-webkit-transform-origin: 50% 10% 0;-o-transform-origin: 50% 10% 0;-ms-transform-origin: 50% 10% 0;margin: 0 0;padding: 0 0;border: none;background: #FFF;border: 1px solid #e9e9e9;}


далее найдите:
#custommenu {display: none;}
#mommenu {display: block;}

замените на:
#custommenu {display: none;}
#mommenu {display: block;height: 0px;overflow: visible;}
#mommenu .btn {position: absolute; left:0;top:-115px;background: #fff;}
.mini-cart {position: absolute; right: 10px; top: -55px;}
#slideshow:before {display: none;}

далее найдите:
#header .sum{float:left;position: absolute;top: 55px;z-index: 11;right: 14px;background-color: #fff;border-radius: 30px;}

замените на:
#header .sum{float:left;position: absolute;top: 55px;z-index: 11;right: 0;background-color: #fff;border-radius: 30px;left: 0;text-align: center;}

далее найдите:
#header-top .topheader-left ul.contact-us-now {position: absolute;top: 35px;left: -1px;width: 200px;border: 1px solid #e9e9e9;background: #FFF;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);}

замените на:
#header-top .topheader-left ul.contact-us-now {position: absolute;top: 35px;right: 0;width: 200px;border: 1px solid #e9e9e9;background: #FFF;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);}
А так же категории товаров отображаются не по центру, а еще можно ли выровнять строку поиска с корзиной и меню основным?

#8 Sergey1988

Sergey1988

    Пользователь

  • Пользователи
  • PipPip
  • 35 сообщений

Отправлено 04 Апрель 2019 - 10:38

Просмотр сообщенияVaccina (04 Апрель 2019 - 08:56) писал:

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
#header-top .topheader-right .sns-quickaccess ul.links {overflow:visible;height:auto;position: absolute;top: 35px;left: -114px;background: transparent;width: 160px;padding: 10px 0 0;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);transform-origin: 50% 10% 0;-moz-transform-origin: 50% 10% 0;-webkit-transform-origin: 50% 10% 0;-o-transform-origin: 50% 10% 0;-ms-transform-origin: 50% 10% 0;margin: 0 0;padding: 0 0;border: none;background: #FFF;border: 1px solid #e9e9e9;}

замените на:
#header-top .topheader-right .sns-quickaccess ul.links {overflow:visible;height:auto;position: absolute;top: 35px;left: 0;background: transparent;width: 160px;padding: 10px 0 0;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);transform-origin: 50% 10% 0;-moz-transform-origin: 50% 10% 0;-webkit-transform-origin: 50% 10% 0;-o-transform-origin: 50% 10% 0;-ms-transform-origin: 50% 10% 0;margin: 0 0;padding: 0 0;border: none;background: #FFF;border: 1px solid #e9e9e9;}


далее найдите:
#custommenu {display: none;}
#mommenu {display: block;}

замените на:
#custommenu {display: none;}
#mommenu {display: block;height: 0px;overflow: visible;}
#mommenu .btn {position: absolute; left:0;top:-115px;background: #fff;}
.mini-cart {position: absolute; right: 10px; top: -55px;}
#slideshow:before {display: none;}

далее найдите:
#header .sum{float:left;position: absolute;top: 55px;z-index: 11;right: 14px;background-color: #fff;border-radius: 30px;}

замените на:
#header .sum{float:left;position: absolute;top: 55px;z-index: 11;right: 0;background-color: #fff;border-radius: 30px;left: 0;text-align: center;}

далее найдите:
#header-top .topheader-left ul.contact-us-now {position: absolute;top: 35px;left: -1px;width: 200px;border: 1px solid #e9e9e9;background: #FFF;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);}

замените на:
#header-top .topheader-left ul.contact-us-now {position: absolute;top: 35px;right: 0;width: 200px;border: 1px solid #e9e9e9;background: #FFF;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);}
вот еще выявил такие траблы при разрешении 830х547 :мобильная версия косяки 3.png

#9 Sergey1988

Sergey1988

    Пользователь

  • Пользователи
  • PipPip
  • 35 сообщений

Отправлено 04 Апрель 2019 - 10:45

мобильная версия косяки 4.png

Просмотр сообщенияVaccina (04 Апрель 2019 - 08:56) писал:

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
#header-top .topheader-right .sns-quickaccess ul.links {overflow:visible;height:auto;position: absolute;top: 35px;left: -114px;background: transparent;width: 160px;padding: 10px 0 0;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);transform-origin: 50% 10% 0;-moz-transform-origin: 50% 10% 0;-webkit-transform-origin: 50% 10% 0;-o-transform-origin: 50% 10% 0;-ms-transform-origin: 50% 10% 0;margin: 0 0;padding: 0 0;border: none;background: #FFF;border: 1px solid #e9e9e9;}

замените на:
#header-top .topheader-right .sns-quickaccess ul.links {overflow:visible;height:auto;position: absolute;top: 35px;left: 0;background: transparent;width: 160px;padding: 10px 0 0;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);transform-origin: 50% 10% 0;-moz-transform-origin: 50% 10% 0;-webkit-transform-origin: 50% 10% 0;-o-transform-origin: 50% 10% 0;-ms-transform-origin: 50% 10% 0;margin: 0 0;padding: 0 0;border: none;background: #FFF;border: 1px solid #e9e9e9;}


далее найдите:
#custommenu {display: none;}
#mommenu {display: block;}

замените на:
#custommenu {display: none;}
#mommenu {display: block;height: 0px;overflow: visible;}
#mommenu .btn {position: absolute; left:0;top:-115px;background: #fff;}
.mini-cart {position: absolute; right: 10px; top: -55px;}
#slideshow:before {display: none;}

далее найдите:
#header .sum{float:left;position: absolute;top: 55px;z-index: 11;right: 14px;background-color: #fff;border-radius: 30px;}

замените на:
#header .sum{float:left;position: absolute;top: 55px;z-index: 11;right: 0;background-color: #fff;border-radius: 30px;left: 0;text-align: center;}

далее найдите:
#header-top .topheader-left ul.contact-us-now {position: absolute;top: 35px;left: -1px;width: 200px;border: 1px solid #e9e9e9;background: #FFF;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);}

замените на:
#header-top .topheader-left ul.contact-us-now {position: absolute;top: 35px;right: 0;width: 200px;border: 1px solid #e9e9e9;background: #FFF;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);}
и вот еще в карточкке товара совсем хаос :unsure:мобильная версия косяки 4.png

Прикрепленные изображения

  • мобильная версия косяки 4.png

#10 Sergey1988

Sergey1988

    Пользователь

  • Пользователи
  • PipPip
  • 35 сообщений

Отправлено 04 Апрель 2019 - 11:05

Скажите,сколько будет стоить довести все до ума в адаптивной части и в версии для пк сделать вот так задание.jpg ???

#11 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 05 Апрель 2019 - 02:42

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
#header-top .topheader-right .sns-quickaccess {height: 36px;width: 36px;position: relative;cursor: pointer;border-left: 1px solid #e9e9e9;border-right: 1px solid #e9e9e9;}


замените на:
#header-top .topheader-right {float: left;}
#header-top .topheader-right .sns-quickaccess {height: 36px;width: 36px;position: relative;cursor: pointer;border-left: 1px solid #e9e9e9;border-right: 1px solid #e9e9e9;}


далее найдите:
#header .sum{float:left;position: absolute;top: 55px;z-index: 11;right: 0;background-color: #fff;border-radius: 30px;left: 0;text-align: center;}

замените на:
#header .sum{float:left;position: absolute;top: 55px;right: 0;background-color: #fff;border-radius: 30px;left: 0;text-align: center;}

далее найдите:
#header .sum{float:left;position: absolute;top: 70px;z-index: 11;right: 14px;background-color: #fff;border-radius: 30px;}

замените на:
#header .sum{float:left;position: absolute;top: 70px;right: 14px;background-color: #fff;border-radius: 30px;}

далее найдите:
#header .sum{float:left;position: absolute;top: 45px;z-index: 11;right: 14px;}

замените на:
#header .sum{float:left;position: absolute;top: 45px;right: 14px;}

далее найдите:
#mommenu .btn {display:inline-block;cursor:pointer;margin: 13px 0 0 15px;position: relative;z-index: 2;padding: 0 0;background: transparent;width: 49px;height: 49px;line-height: 49px;-webkit-border-radius: 12px;-moz-border-radius: 12px;border-radius: 12px;text-align: center;border: 1px solid rgba(230, 230, 230);}

замените на:
#mommenu .btn {display:inline-block;cursor:pointer;margin: 13px 0 0 15px;position: relative;padding: 0 0;background: transparent;width: 49px;height: 49px;line-height: 49px;-webkit-border-radius: 12px;-moz-border-radius: 12px;border-radius: 12px;text-align: center;border: 1px solid rgba(230, 230, 230);}

далее найдите:
#slideshow:before {display: none;}

замените на:
#breadcrumbs::before {top: 0;}

Стоимость платных доработок вы можете узнать лишь по почте support@storeland.ru, так как платными доработками занимаются другие специалисты.
Обратно в Изменение общей стилистики



Темы с аналогичным тегами адаптивная часть

Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных

  1. Форум владельцев интернет-магазинов
  2. → Вопросы работы сервиса StoreLand
  3. → Дизайн
  4. → Шаблон Лазурь
  5. → Изменение общей стилистики
  6. Privacy Policy