Responsive Bild Flex Lücke BUG?

[Matthias Apsel]

Hallo Henry,

weil egal wo du im Netz suchst, knallt dir immer ein Must-Do entgegen für responsive Bilder das da lautet: max-width:100%;height:auto;

Flexbox und Grid nehmen dir da schon etwas ab. Und wenn du dann mit anderen Abmessungswünschen dazwischenfunkst, kann das schon schief gehen.

dass ein Bild zb. maximal 70% seiner Originalgröße(nicht seines Elternelements) anzeigt und das Layout nicht zerstört.

Warum soll man ein Bild in 100% der Abmessungen übertragen, wenn man es dann immer(!) verkleinert??

@Gunnar

Zur Browserkompatibilität sagst du:

*gähn

Nein, nicht zur Browserkompatibilität, sondern zu deinem Wunsch, irrelevanten Browsern die neuesten Optionen verpassen zu wollen.

Bei anderen Sachen bist du oft ein Erbsenzähler 😉 vor dem Herrn aber wenn 10-20% der User hier das Ganze fehlerhaft angezeigt bekommen ist das nur "*gähn"? Seltsame Prioritäten.

Es ist wichtig, dass die Seite bedienbar ist.

Nur mal um zu zeigen wie es bereits mit Samsung Internet und IE (Exoten noch gar nicht berücksichtigt) aussieht und dieser Marktanteil ist schon hoch genug um dem Beachtung zu schenken.

Für ganz schmale Browser müsste man vielleicht noch was tun.

Für ein theoretisches Beispiel würde ich allerdings den Aufwand nicht treiben wollen.

Was die Codezeilen von Murphy betrifft, damit meinte ich gar nicht deren Richtigkeit, sondern dass sie fürs Beispiel, weil auch vieles inhaltsleer, keine Bedeutung haben, womit ich nur "sinnfrei" hinterfragen wollte. Egal, nicht wichtig.

Das ist ein Grundgerüst, das MrMurphy für jedes seiner Beispiele verwendet.

Wichtiger ist aber dann wohl auch für dich, sofern du nicht auch noch FF als Browser ignorieren willst, dies (unterschiedliche Browser, unterschiedliches Verhalten, kein Browser wie gewünscht):

aber alle Inhalte sind zugänglich.

Gleichzeitig habe ich den Text gekürzt, damit man auch direkt sehen kann, dass der Inhalt zentriert dargestellt wird. Also nichts mit linksbündig.

Tja, dann stimmt wohl irgendwas nicht mit meiner Perspektive, oder deiner? (Und das ist FF, kommt mir also nicht mit Browserproblem.)

text-align: center vergessen?

MrMurphys Kritik mag harsch klingen, beachte sie dennoch.

sein überragendes Beispiel dann aber letztendlich auch versagt.

Definiere versagen.

Bis demnächst
Matthias