Forum digitalis

Introduction

Flexbox is a CSS module for flexible layouts. The container is activated with `display: flex`. `flex-direction` sets the direction of the items, `justify-content` the horizontal alignment, `align-items` the vertical alignment, and `gap` the spacing between items. Items can adjust their size with `flex` and be individually aligned using `align-self`.

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

.item {
    flex: 1;          /* takes available space */
    align-self: flex-start; /* individual alignment */
}

2.6 Flexbox

Introduction

Introduction