Это мой первый вопрос на Stackoverflow, поэтому я постараюсь отформатировать его правильно. На Hover Div также получает тень, которая, конечно, должна быть за пределами контура.
Это хорошо сочетается во всех браузерах, за исключением Firefox. Firefox, кажется, по какой-то причине визует контур за пределами коробки..block {
background: #eceeeb;
border: 3px solid white;
outline: 2px solid lavender;
width: 240px;
padding: 10px;
float: left;
height: 130px;
margin: 40px;
text-align: center;
cursor: default;
-moz-transition: background 0.7s, -moz-box-shadow 0.3s;
-webkit-transition: background 0.7s, -webkit-box-shadow 0.3s;
-o-transition: background 0.7s;
transition: background 0.7s, box-shadow 0.3s;
}
.block:hover {
background: whitesmoke;
-webkit-box-shadow: 0px 0px 18px rgba(50, 50, 50, 0.30);
-moz-box-shadow: 0px 0px 18px rgba(50, 50, 50, 0.30);
box-shadow: 0px 0px 18px rgba(50, 50, 50, 0.30);
}
< /code>
Я не могу найти правильный способ решения этой проблемы.>
Подробнее здесь: https://stackoverflow.com/questions/155 ... w-on-hover