Ausrichten

1 (text-left)

2 (text-center)

3 (text-right)

Dieser Text ist neben dem Bild. Zwei Bilder, eines mit 100% eines mit 25%, je nach Breakpoint jeweils eins ausgeblendet. Wenn nicht umfließend, dann besser mit separater Spalte. Float und Margine je nach Breakpoint

Dieser Text ist unter dem Bild.

Bild 100% (img-responsive)

Rest

Rand Radius

Grid

Verschahteln (Es stehen jedes mal 12 zur verfügung)

1-1

1-2

3-1

3-2

Abstand dahinter und davor einfügen je nach Breite

1 (mr-auto)

3 (ml-auto)

Leerspalten davor einfügen je nach Breite

2 (offset-1)

3 (offset-1)

Reihenfolge je nach Breite

1 (order-3)

2 (order-2)

3 (order-1)

1 (order-last)

3 (order-first)

Inneren Abstand entfernen (Wird schmäler !!!)

Spalten horrizontal ausrichten

justify-content-start

justify-content-center

justify-content-end

justify-content-around

justify-content-between

Spalten vertikal ausrichten (Oben: align-self-start Mitte: align-self-center Unten: align-self-end)

align-self-start

align-self-center

align-self-end

Ganze Zeile vertikal ausrichten (Oben: align-items-start Mitte: align-items-center Unten: align-items-end)

Ausblenden je nach Breite (d-none)

Spaltenbreite nach Inhalt auto, rest ohne angabe von Breite

Manueller Umbruch w-100 (Um das zu erreichen muss ein Element mit width 100% eingefügt, also w-100)
Achtung: In kombination mit d-none kann der Umbruch je nach Breite sein

Automatische Breite, je nachdem wie viele Elemente
Alles bleibt unabhängig von der Breite des Bildschirms immer in einer Zeile

1 Spalten / 2 Spalten / 3 Spalte

container

container-fluid