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

hottab_1

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

AlekVolsk

  • Гуру
  • 6915
  • 415 / 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

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

.sale {
    background: #cd2626;
}

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

hottab_1

  • Осваиваюсь на форуме
  • 41
  • 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

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

.sale {
    background: #cd2626;
}

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

Biss

  • Давно я тут
  • 994
  • 101 / 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

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

Один пункт меню думает что он главный

Автор DamaVbubi

Ответов: 4
Просмотров: 309
Последний ответ 13.02.2024, 19:49:10
от DamaVbubi
[Решено] Перестали работать переходы по меню сайта

Автор AlexP750

Ответов: 12
Просмотров: 538
Последний ответ 06.02.2024, 12:42:26
от AlexP750
Пропало главное меню, и контент на главной (после обновления)

Автор GTHack

Ответов: 15
Просмотров: 541
Последний ответ 07.01.2024, 16:00:15
от ProtectYourSite
Автоматическая снятие с публикации пункта меню

Автор all_zer

Ответов: 2
Просмотров: 340
Последний ответ 30.12.2023, 15:29:58
от all_zer
Отображение меню мобильной версии сайта

Автор AnSk

Ответов: 1
Просмотров: 346
Последний ответ 22.08.2023, 18:52:55
от arma