Перейти к содержанию
SK999

[РЕШЕНО] Рамка при наведении на товар

Рекомендуемые сообщения

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

 

Cайт iget.com.ua

 

Помогите кто знает, пожалуйста)

post-684961-0-50676500-1421664307_thumb.jpg

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Тогда рамку будет всегда, а не при наведении.

Чтоб она появилась при наведении нужно эту строку

border: 1px solid #ccc;

добавить к стилю

.box .box-content .box-product ul li:hover

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Можно добавить в файл stylesheet.css следующий код:

.box .box-content .box-product ul li:hover {
border: 1px solid #ccc;
}
 
.box .box-content .box-product ul li {
padding-bottom:23px;
margin-top:23px
margin-bottom:24px;
margin-left:24px;
border: 1px solid #fff;
}

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

 

Можно добавить в файл stylesheet.css следующий код:

.box .box-content .box-product ul li:hover {
border: 1px solid #ccc;
}
 
.box .box-content .box-product ul li {
padding-bottom:23px;
margin-top:23px
margin-bottom:24px;
margin-left:24px;
border: 1px solid #fff;
}

Спасибо, а не подскажешь куда нужно вставить код что бы и в категория работало?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Спасибо, а не подскажешь куда нужно вставить код что бы и в категория работало?

 

/catalog/view/theme/default/stylesheet 

.product-grid > div {
width: 230px;
display: inline-block;
margin: 10px 15px 20px 23px;
vertical-align: top;
border: 1px solid rgba(180, 198, 236, 0.23);
}
.product-grid > div:hover {
border: 1px solid #b4c6ec;
box-shadow: 5px 5px 13px 0 rgba(54,69,102,0.5);
-moz-box-shadow: 5px 5px 13px 0 rgba(54,69,102,0.5);
-webkit-box-shadow: 5px 5px 13px 0 rgba(54,69,102,0.5);
-moz-border-radius-topleft: 5px;
-webkit-border-top-left-radius: 5px;
border-top-left-radius: 5px;
-moz-border-radius-topright: 5px;
-webkit-border-top-right-radius: 5px;
border-top-right-radius: 5px;
}

post-679086-0-66148900-1422038270_thumb.png

post-679086-0-57748700-1422038431_thumb.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

 

/catalog/view/theme/default/stylesheet 

.product-grid > div {
width: 230px;
display: inline-block;
margin: 10px 15px 20px 23px;
vertical-align: top;
border: 1px solid rgba(180, 198, 236, 0.23);
}
.product-grid > div:hover {
border: 1px solid #b4c6ec;
box-shadow: 5px 5px 13px 0 rgba(54,69,102,0.5);
-moz-box-shadow: 5px 5px 13px 0 rgba(54,69,102,0.5);
-webkit-box-shadow: 5px 5px 13px 0 rgba(54,69,102,0.5);
-moz-border-radius-topleft: 5px;
-webkit-border-top-left-radius: 5px;
border-top-left-radius: 5px;
-moz-border-radius-topright: 5px;
-webkit-border-top-right-radius: 5px;
border-top-right-radius: 5px;
}

 

Что то у меня не получается, не могу найти куда вставить этот код, куда не вставляю не чего не получается

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Гость
Вы комментируете как гость. Если у вас есть аккаунт, пожалуйста, войдите
Ответить в этой теме...

×   Вы вставили контент с форматированием.   Удалить форматирование

  Разрешено использовать не более 75 смайлов.

×   Ваша ссылка была автоматически встроена.   Отображать как обычную ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.


  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.