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


Как Сделать Черточки В Стикерах Посередине Стикера


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

#1 Ovottona

Ovottona

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

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

Отправлено 09 Декабрь 2015 - 09:19

Добрый день.
Тема лето, Аккаунт SL-365620
Изменила название стикеров со Скидки на "Акция" и с Новинка на "В ЕКБ"
При этом черточки сверху и снизу на стикерах съехали вправо.
Как сделать их посередине?

Также как сейчас на стикерах "Хит"

Второй вопрос:
В верхнем меню есть ромбик с машинкой. Как сделать так, чтобы при кликании на ромбик сворачивалась надпись "Доставка и оплата".
Чтобы было так же как с телефоном и почтой.

Я думаю из-за этой надписи у меня съехало меню в мобильной версии.

И как при наведении на значек с машинкой была надпись "Доставка и оплата"

Заранее спасибо!

#2 RedHead

RedHead

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

  • Модератоpы
  • 1 052 сообщений

Отправлено 09 Декабрь 2015 - 10:16

Просмотр сообщенияOvottona (09 Декабрь 2015 - 09:19) писал:

Добрый день.
Тема лето, Аккаунт SL-365620
Изменила название стикеров со Скидки на "Акция" и с Новинка на "В ЕКБ"
При этом черточки сверху и снизу на стикерах съехали вправо.
Как сделать их посередине?

Также как сейчас на стикерах "Хит"

Второй вопрос:
В верхнем меню есть ромбик с машинкой. Как сделать так, чтобы при кликании на ромбик сворачивалась надпись "Доставка и оплата".
Чтобы было так же как с телефоном и почтой.

Я думаю из-за этой надписи у меня съехало меню в мобильной версии.

И как при наведении на значек с машинкой была надпись "Доставка и оплата"

Заранее спасибо!

Здравствуйте! В шаблоне main.css найдите строки:
.ico-product .ico-new span:before {content: "";width: 38px;height: 1px;position: absolute;top: 0;background: #ffffff;left: 5px;}
.ico-product .ico-new span:after {content: "";width: 38px;height: 1px;position: absolute;bottom: 0;background: #ffffff;left: 5px;}
замените на
.ico-product .ico-new span:before {content: "";width: 38px;height: 1px;position: absolute;top: 0;background: #ffffff;left: -2px;}
.ico-product .ico-new span:after {content: "";width: 38px;height: 1px;position: absolute;bottom: 0;background: #ffffff;left: -2px;}

далее в этом же шаблоне найдите строки
.ico-product .ico-sale span:before {content: "";width: 30px;height: 1px;position: absolute;top: 0;background: #ffffff;left: 5px;}
.ico-product .ico-sale span:after {content: "";width: 30px;height: 1px;position: absolute;bottom: 0;background: #ffffff;left: 5px;}
замените их на
.ico-product .ico-sale span:before {content: "";width: 30px;height: 1px;position: absolute;top: 0;background: #ffffff;left: 3px;}
.ico-product .ico-sale span:after {content: "";width: 30px;height: 1px;position: absolute;bottom: 0;background: #ffffff;left: 3px;}

Далее в этом же шаблоне найдите строки
.info-menu {
	 display: inline-block;
	 float: left;
	 position: relative;
	 line-height: 46px;
	 margin-left: 7px;
	 font-size: 18px;
}
переместите их, вставив перед строкой
/******************************************************************************
Адаптивная часть
потом после строки
@media all and (max-width: 991px) {
добавьте
.info-menu {display: none;position: absolute;background-color: #fff;box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.1);left: 100%;z-index: 2;width: 200px;padding: 0 5px;}

Теперь меню не съезжает в мобильной версии, надпись "Доставка и оплата" скрывается.
При наведении на иконку с машинкой, отображается всплывающая подсказка.
1.png

#3 Ovottona

Ovottona

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

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

Отправлено 10 Декабрь 2015 - 16:59

Просмотр сообщенияRedHead (09 Декабрь 2015 - 10:16) писал:

Здравствуйте! В шаблоне main.css найдите строки:
.ico-product .ico-new span:before {content: "";width: 38px;height: 1px;position: absolute;top: 0;background: #ffffff;left: 5px;}
.ico-product .ico-new span:after {content: "";width: 38px;height: 1px;position: absolute;bottom: 0;background: #ffffff;left: 5px;}
замените на
.ico-product .ico-new span:before {content: "";width: 38px;height: 1px;position: absolute;top: 0;background: #ffffff;left: -2px;}
.ico-product .ico-new span:after {content: "";width: 38px;height: 1px;position: absolute;bottom: 0;background: #ffffff;left: -2px;}

далее в этом же шаблоне найдите строки
.ico-product .ico-sale span:before {content: "";width: 30px;height: 1px;position: absolute;top: 0;background: #ffffff;left: 5px;}
.ico-product .ico-sale span:after {content: "";width: 30px;height: 1px;position: absolute;bottom: 0;background: #ffffff;left: 5px;}
замените их на
.ico-product .ico-sale span:before {content: "";width: 30px;height: 1px;position: absolute;top: 0;background: #ffffff;left: 3px;}
.ico-product .ico-sale span:after {content: "";width: 30px;height: 1px;position: absolute;bottom: 0;background: #ffffff;left: 3px;}

Далее в этом же шаблоне найдите строки
.info-menu {
	 display: inline-block;
	 float: left;
	 position: relative;
	 line-height: 46px;
	 margin-left: 7px;
	 font-size: 18px;
}
переместите их, вставив перед строкой
/******************************************************************************
Адаптивная часть
потом после строки
@media all and (max-width: 991px) {
добавьте
.info-menu {display: none;position: absolute;background-color: #fff;box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.1);left: 100%;z-index: 2;width: 200px;padding: 0 5px;}

Теперь меню не съезжает в мобильной версии, надпись "Доставка и оплата" скрывается.
При наведении на иконку с машинкой, отображается всплывающая подсказка.
Прикрепленный файл 1.png
Спасибо.
Со стикерами все получилось.

А вот с доставкой нет.
Может я что-то не то сделала. Но делала все, что вы написали.
Проверьте, пожалуйста.

и в мобильной версии тоже все осталось по прежнему

#4 Юля123

Юля123

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

  • Модератоpы
  • 2 567 сообщений

Отправлено 10 Декабрь 2015 - 17:17

Просмотр сообщенияOvottona (10 Декабрь 2015 - 16:59) писал:

Спасибо.
Со стикерами все получилось.

А вот с доставкой нет.
Может я что-то не то сделала. Но делала все, что вы написали.
Проверьте, пожалуйста.

и в мобильной версии тоже все осталось по прежнему

Здравствуйте, в верхнем меню, по наведению на машинку высплывает  подсказка "Доставка и оплата".  Уточните, что нужно изменить.

QIP Shot - Screen 053.png

Аналогичный вопрос по мобильной версии. Сейчас у Вас всё отображается корректно. Попробуйте почистить кеш браузера. Или уточните, что нужно изменить.




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

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