Testseite für responsives Layout - Schritt 2

Fügen Sie in Ihre bisherige Testseite noch ein drittes div-Element hinzu. Es soll als Inhalt ein Bild enthalten. Benutzen Sie eine beliebige Bilddatei, allerdings sollte das Bild im Original maximal 300px * 300px groß sein.

Setzen Sie im hinzugefügten div-Element eine Hintergrundfarbe und die Breite auf 23%.

Das enthaltene Bild soll eine maximale Breite von 100% haben. Überprüfen Sie im Browser die Auswirklung der beiden alternativen Einstellungen für das img-Element, indem Sie das Fenster breiter und schmaler ziehen:

• Alternative 1: Angabe der Breite

  img {
      width: 100%;
  }

• Alternative 2: Angabe der maximalen Breite

  img {
      max-width: 100%;
  }