Forum digitalis

Einführung

Flexbox ist ein CSS-Modul für flexible Layouts. Der Container wird mit `display: flex` aktiviert. `flex-direction` legt die Richtung der Elemente fest, `justify-content` die horizontale Ausrichtung, `align-items` die vertikale Ausrichtung, und `gap` den Abstand zwischen den Elementen. Items können mit `flex` ihre Grösse anpassen und mit `align-self` individuell ausgerichtet werden.

.container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.item {
    flex: 1;          /* nimmt verfügbaren Platz ein */
    align-self: flex-start; /* individuelle Ausrichtung */
}

2.6 Flexbox

Einführung

Einführung