У меня есть таблица цен с 3 карточками в
<div class="pricing-table table1">
<div class="pricing-table table2">
<div class="pricing-table table3">
со всем содержимым внутри. Также у меня есть эффект hove
@media (min-width: 728px) {
.pricing-table:hover {
margin-top: -.25rem;
margin-bottom: .25rem;
box-shadow: 0.2rem 0.7rem 1rem 0 rgba(0, 0, 0, 0.1);
}
Все работает хорошо, кроме одной вещи. При наведении курсора на первую и вторую карты все в порядке, но когда я парю последнюю карту, это влияет на всю таблицу. Как можно этого избежать?