0 Пользователей и 1 Гость просматривают эту тему.
  • 6 Ответов
  • 365 Просмотров
*

hottab_1

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
Здравствуйте!
Есть сайт http://www.dvernoyclub.ru/, в меню, где идут пункты "Каталог товаров", "Акции и подарки" и так далее. Есть пункт (самый последний) "Купить в кредит". Для этого пункта нужно сделать совсем другое оформление.
Пробовал прописать отдельный класс в CSS, вывел его модулем в позицию меню, подогнал на нужное место, но появилась проблема, при изменении размера экрана блок уезжает, то есть он не ведет себя так, как ведет меню.
Подскажите, пожалуйста, как привязать свой класс к пункту меню, чтобы он не уезжал, а вел себя один в один как пункт меню. Или может есть какое-то другое решение?  !
Решение через ::before не подходит, так как в блоке будет картинка, текст и ссылка.
*

AlekVolsk

  • Гуру
  • 6406
  • 361 / 4
у пункта меню выведен отдельный класс, item-139, привяжитесь к нему, напрмер:
Код: css
.item-139 > a {
    background-color: #88c500;
    color: #fff;
}
.item-139 > a:hover, .item-139 > a:focus {
    background-color: #f00;
    color: #fff !important;
}

фон картинкой привязывайте именно к ссылке, сместить текст ссылки можно внутренними отступами и высотой строки (требуется подгонка по месту на разных экранах)
*

Biss

  • Давно я тут
  • 838
  • 88 / 0
Сделал немного по другому, без привязки к id. Редактирование пункта меню - во вкладке - параметры ссылки - CSS-класс ссылки, прописал sale
потом в CSS

.sale {
    background: #cd2626;
}

пример сайт в профиле
*

hottab_1

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
у пункта меню выведен отдельный класс, item-139, привяжитесь к нему, напрмер:
Код: css
.item-139 > a {
    background-color: #88c500;
    color: #fff;
}
.item-139 > a:hover, .item-139 > a:focus {
    background-color: #f00;
    color: #fff !important;
}

фон картинкой привязывайте именно к ссылке, сместить текст ссылки можно внутренними отступами и высотой строки (требуется подгонка по месту на разных экранах)
Я понял вас, спасибо.
А чтобы применить определенный стиль к тексту, конкретно в этой ссылке тоже нужно прописывать вот тут?
Код
.item-139 > a:hover, .item-139 > a:focus {
    background-color: #f00;
    color: #fff !important;
}
*

hottab_1

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
Сделал немного по другому, без привязки к id. Редактирование пункта меню - во вкладке - параметры ссылки - CSS-класс ссылки, прописал sale
потом в CSS

.sale {
    background: #cd2626;
}

пример сайт в профиле
Стиль для текста тоже тут можно указать? И если сделать еще .sale:hover, будет работать?
*

Biss

  • Давно я тут
  • 838
  • 88 / 0
.sale a{
    color: #cd2626;
}
.sale a:hover{
    color: #cd2626;
}
возможно надо будет добавить !important и кроме того указывать родителя .nav li.sale a:hover как то так, но это надо пробовать
« Последнее редактирование: 01.07.2016, 17:37:24 от Biss »
*

hottab_1

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
Хорошо, понял, спасибо.
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Модальное меню из DJ-Classifieds

Автор cirip

Ответов: 0
Просмотров: 9
Последний ответ 22.05.2018, 17:53:24
от cirip
Как изменить стандартную форму редактирования/создания материала?

Автор tora312

Ответов: 6
Просмотров: 124
Последний ответ 22.05.2018, 08:47:22
от NewUsers
Не могу тег прикрепить к меню

Автор HolySong

Ответов: 1
Просмотров: 80
Последний ответ 21.05.2018, 09:13:46
от HolySong
Программное добавление ссылки в backend-меню на страницу настроек плагина

Автор doc360

Ответов: 4
Просмотров: 107
Последний ответ 18.05.2018, 14:38:20
от NewUsers
Изменить URL материала не меняя положение в меню

Автор Inngrid

Ответов: 7
Просмотров: 143
Последний ответ 13.05.2018, 06:21:06
от effrit