• Никакой политики на форуме. Иначе - бан!
  • Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!
  • Темы озаглавленные с маленькой буквы или капсом удаляются без предупреждения!

Помогите с CSS

Kozak1991777

Новичок
Вот сайт: http://tehnoua.netxi.in/product-category/butovaya-tehnika/boyleru.
Я при помощи css сделал вот что:
1. Обрезал название товаров до одной строки
.product-title-wrapper .product-title{
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
2. Показывает полное название при наведении курсора
.product-title-wrapper .product-title:hover {
white-space: normal;
}
Проблема в том, что если название товара длинное или у товара есть две цены или то и другое, в общем кнопка "В корзину" выезжает за пределы карточки, что смотрится некрасиво. Как вообще скрыть кнопку знаю, но вот как мне совместить, чтобы при наведении курсора показывалось полное название товара и скрывалась кнопка "В корзину"?
 

tuxfighter

Гуру
Местный
CSS:
.product-title-wrapper:hover~div.product-item-meta.add-to-cart-button{
    display: none !important;
}

Пожалуйста оформляйте код нормально
 

Kozak1991777

Новичок
CSS:
.product-title-wrapper:hover~div.product-item-meta.add-to-cart-button{
    display: none !important;
}

Пожалуйста оформляйте код нормально
Спасибо, что откликнулись, предложенный вами код только скрывает кнопку "В корзину", но не показывает полное название товара.
 
Сверху Снизу