Hallo Leute,
habe ein Problem, wie bekomme ich hier hin: Testseite
das die Vorschaubilder immer die gleiche Grösse behalten (auch wenn man strg++ verwendet!!!)
Die Fotos sind entweder 340px hoch, andere auch 340px breit und sie sollen nur nicht grösser werden.
Der Firefox hat irgendwie die Angewohnheit die Fotos die schmaler als 340px sind (die dafür aber 340px hoch sind)
auf eine Breite von 340px Breite (width) zu skalieren und so wächst das Bild auch in der Höhe.
Solch eine Eigenschaft möchte ich aber nicht unbedingt!
2.: Gibt es ein display: flex; das ich nicht hinschreiben brauche also durch ein übergeordnetes display:flex;
trotzdem funktionieren würde?
Okay, dann lege ich mal los:
A) Wenn man das Bildschirmfenster zusammenschiebt sollten sich die IMG (bis zum jeweiligen Breakpoint)
eher proportional verkleinern! Nie aber vergrössern!
Ich bin mir nicht sicher ob das meiner Lösung genauso macht!
B) Wenn man mit strg++ die Schrift vergrössert (bei mir im Opera auf 500% / Firefox 300% etc) dann sollten
sich die IMGs nicht (proportional) mit vergrössern sondern am liebsten sollen die IMGs die Grösse wie bei
100% ungefähr behalten.
Beim Firefox habe ich das Gefühl, das bei einer Schriftvergrösserung die IMGs unproportional dargestellt werden und das die IMGs von Haus aus die Breite von “figure” einnimmt (figure ist etwas Grösser als 340px)
und somit das IMG sich anpassend wächst!
Die IMG haben entweder eine Höhe von max. 340px oder breitere IMG`s eine Breite von max. 340px!
Die Höhe bzw. Breite dann dem entsprechend!
Wie es im IE verhältt weiss ich gar nicht!
C) Gibt es ein display: flex; das ich nicht hinschreiben brauche also durch ein übergeordnetes display:flex;
trotzdem funktionieren würde?
Zu A: Ich empfehle dir den link zu den media queries evtl. doch nochmal laenger anzuschauen, denn da ist deine antwort bereits enthalten (stichwort: max-width).
B: Du willst eine alternative skalierung der bilder beim zoomen erreichen?
Grundsaetzlich wuerde ich dir empfehlen mal flexbox anzuschauen.
