Große CSS-Probleme / in Verbindung mit Bootstrap 5

[Gunnar Bittersmann]

@@Rolf B

Dein gezeigtes CSS setzt die Bildbreite auf max-width: 100% und dann width/height auf auto, angeblich um das Seitenverhältnis zu wahren. Das ist schonmal merkwürdig, ein Bild behält eigentlich sein Seitenverhältnis, solange Du nur width ODER height angibst.

Nein, nicht, wenn man’s richtig macht und width und height im Markup angibt, damit der Browser das Seitenverhältnis des Bilds kennt, bevor es geladen ist, und entsprechend Platz freihält, um später nicht nochmal alles anders machen zu müssen.

Siehe Beispiel: die Breite des Bilds kommt vom Stylesheet, die Höhe wird vom Markup übernommen, das Bild wird verzerrt, die Räder sind nicht mehr kreisrund.

Wenn man (min-)width setzt, sollte man height: auto setzen und andersrum, damit ein Bild sein Seitenverhältnis beibehält.

Kwakoni Yiquan