Course Content
CSS Fundamentals
1. Introduction to CSS
CSS Fundamentals
Justify Content Horizontally
The justify-content
property is instrumental in determining the position of flex items along the main axis. Its default value is flex-start
.

Let's consider each case on practice. We will play with the list of cards.
flex-start
Default value, which makes all the items be at the start of the main axis.
index.html
index.css
index.js
flex-end
All items are at the axis end.
index.html
index.css
index.js
center
All items are in the center.
index.html
index.css
index.js
space-around
It distributes all the items evenly along the main axis with a bit of space left at either end.
index.html
index.css
index.js
space-between
It is very similar to space-around
except that it doesn't leave any space at the axis on both ends.
index.html
index.css
index.js
Which of the following values for the justify-content property will align flex items along the center of a flex container?
Select the correct answer
Everything was clear?