Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lernen Herausforderung: Ein Fehlerhaftes Layout Beheben | Dekorative und Moderne Effekte
CSS-Grundlagen

Herausforderung: Ein Fehlerhaftes Layout Beheben

Swipe um das Menü anzuzeigen

Sie erhalten drei Karten. Aktualisieren Sie das Layout gemäß den folgenden Anforderungen. Jede Karte sollte:

  • Eine Breite von 200px haben.
  • Über 20px Innenabstand verfügen.
  • 15px Abstand zwischen den Karten haben.
  • Einen Rahmen mit 2 Pixeln Breite, solidem Stil und grauer Farbe besitzen.
  • Die deklarierte Breite soll unverändert bleiben, auch nach Hinzufügen von Padding und Rahmen.
index.html

index.html

index.css

index.css

  • Die Eigenschaft width zur Definition der Breite des Elements verwenden.
  • padding für den Innenabstand nutzen.
  • margin verwenden, um Abstand zwischen den Karten zu schaffen.
  • border: 2px solid gray für den Rahmen einsetzen.
  • box-sizing: border-box verwenden, damit Padding und Rahmen die Gesamtbreite nicht erhöhen.
index.html

index.html

index.css

index.css

War alles klar?

Wie können wir es verbessern?

Danke für Ihr Feedback!

Abschnitt 1. Kapitel 15

Fragen Sie AI

expand

Fragen Sie AI

ChatGPT

Fragen Sie alles oder probieren Sie eine der vorgeschlagenen Fragen, um unser Gespräch zu beginnen

Abschnitt 1. Kapitel 15
some-alt