Mit CSS hätte den Vorteil, dass nur ein Bild existiert. Ich gehe davon aus, dass in beiden die gleichen Bilder drin sein sollen. Ansonsten würde ich das auch so machen wie Spooky.
Hier mal ein CSS Beispiel.
PHP-Code:
.ce_image.square {
position: relative;
width: 250px;
height: 250px;
overflow: hidden;
}
.ce_image.square figure {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.ce_image.square figure,
.ce_image.square img {
display: block;
margin: 0;
/* falls gesetzt überschreiben */
width: auto;
max-width: none;
height: auto;
max-height: none;
}
Was bei dir schon gesetzt ist brauchst du natürlich nicht nochmal. Und überschreiben auch nur, wenn es was zum Überschreiben gibt.
Lesezeichen