Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aligning Items Vertically | Flexbox
CSS Fundamentals
course content

Contenido del Curso

CSS Fundamentals

CSS Fundamentals

1. Introduction to CSS
2. Text Styles
3. Box Model and Element Spacing
4. Flexbox
5. Decorative Effects

bookAligning Items Vertically

The align-items property governs the vertical arrangement of flex items. Its default value is stretch.

Let's run the following examples to get where do we need it.

stretch

It means that we extend items to the entire length of the cross axis.

html

index

css

index

js

index

copy

center

Items are in the center of the cross axis.

html

index

css

index

js

index

copy

flex-start

All items start at the beginning of the cross axis.

html

index

css

index

js

index

copy

flex-end

All items are in the end of the cross axis (in the end of the parent flex container).

html

index

css

index

js

index

copy

baseline

All flex items are aligned based on their text content baseline.

html

index

css

index

js

index

copy
1. What does the `align-items` property do?
2. Which of the following values can be used with the `align-items` property?
What does the `align-items` property do?

What does the align-items property do?

Selecciona la respuesta correcta

Which of the following values can be used with the `align-items` property?

Which of the following values can be used with the align-items property?

Selecciona unas respuestas correctas

¿Todo estuvo claro?

¿Cómo podemos mejorarlo?

¡Gracias por tus comentarios!

Sección 4. Capítulo 4
some-alt