MrMurphy1: Hausaufgabe: Layout mit Bootstrap nachbauen? Hä?

Beitrag lesen

Hallo

Du denkst und machst das viel zu kompliziert. Die Aufgabe fordert nur und ausschließlich die Angaben umzusetzen.

Änderungen am CSS von Bootstrap oder gar eigenes CSS sind nicht gefordert und nicht erforderlich.

Den umschließenden Container mit der der Klasse "container-fluid" hast du erstellt. Ich kenne die Aufgabe 4.1 nicht. Wenn dort für den umschließenden Container die Klasse "container" verwendet wurde solltest du ihn auch in dieser Aufgabe verwenden. Ansonsten kannst du einen wählen.

In dem Quellcode sollen nun nur noch die Breakpoints über die dafür von Bootstrap vorgesehen Klassen nach den Vorgaben gesetzt werden. Dabei sollen die vorgegebenen Zahlen (3, 9 und 12) jeweils beibehalten werden. Deshalb werden sie ja vorgegeben.

Das sind vier Stück. header, nav mit der id navMain, main und nav im Footer.

Nutzen Sie für das Einspalten-Layout die Klassen für Extra Small Devices

Das sind in einem 12er-Grid die col mit 12. In dem vorgegebenen Quelltext somit header und nav im footer. Extra small Devices (Extra kleine Geräte) bekommen in Bootstrap den Zusatz xs. Also bekommen header und nav im footer nur jeweils die Klasse col-xs-12 und keine weiteren.

für das Zweispalten-Layout die anderen Geräteklassen

Das betrifft nav mit der id navMain und main. Die anderen Geräteklassen sind sm, md und lg. Das nav mit der id navMain bekommt also die drei Klassen "col-sm-3 col-md-3 col-lg-3" und main die Klassen "col-sm-9 col-md-9 col-lg-9".

Damit sind alle Änderungen im Quelltext erledigt und du musst nur noch den Unterschied zwischen den Klassen container und container-fluid erklären.

Nachtrag: Wenn in der Aufgabe 4.1 noch andere Layoutangaben gefordert wurden sollen die in dieser Aufgabe auch durchgeführt werden, falls sie noch nicht vorhanden sind.

Gruss

MrMurphy