Bild zoomen auf schweben, Bild halten zentriert
.featured-items__image-container {
height: 250px;
overflow: hidden;
width: 370px;
}
.featured-items__item-image {
@include animate(all, 500ms);
cursor: pointer;
height: 100%;
width: 100%;
}
.featured-items__item-image:hover {
height: 120%;
width: 120%;
}
<div class="featured-items__image-container">
<img class="featured-items__item-image" src="https://unsplash.it/370/250"/>
</div>
So auf schweben, die ich hinzufüge, 20% sowohl die Breite und die Höhe. Was perfekt funktioniert. Aber das Bild ist nicht zentriert und darum kämpfe ich. Beim Zoomen "wächst" das Bild einfach nach rechts. Irgendwelche Tipps?
Perfekt! Vielen Dank :) – Tiwaz89