Aus dem Kurs: Webtechniken lernen 3: Responsive CSS-Layouts mit Media Queries, Flexbox und Grid

So erhalten Sie Zugriff auf diesen Kurs

Werden Sie noch heute Mitglied und erhalten Sie Zugriff auf mehr als 23.200 Kurse von Branchenfachleuten.

Challenge: Die Kontaktseite per Grid gestalten

Challenge: Die Kontaktseite per Grid gestalten

(Musik) In der Challenge zu diesem Kapitel geht es um die Kontakt-Seite, die ist bis jetzt noch relativ umgestaltet, was das Layout angeht. Sie sollen die Abschnitte für das Kontaktformular und für die Kontaktdaten ab einer Viewportbreite von ca. 600px nebeneinander platzieren. Das Kontaktformular soll so gestaltet werden, dass wenn genügend Platz dafür ist, die Beschriftung und die Eingabefelder nebeneinander stehen sollen, und nicht untereinander. Die Beschriftung soll rechtsbündig vor den Eingabefeldern stehen, also richtig dran. Und der Button zum Abschicken soll sich über die gesamte Breite des Formulars erstrecken. Im Browser sieht das Ganze momentan noch so aus, also relativ einspaltig. Und das tut es auch in der Desktop-Version. Und Sie sollen das so verändern, dass es jetzt etwa hier nebeneinander steht. Achten Sie drauf, dass das Formular links steht, und der Abschnitt mit den Kontaktdaten rechts. Die Beschriftung ist rechtsbündig am Feld, die Beschriftung und die…

Inhalt