3 ways to center CSS text vertically and horizontally

1. Flexbox

With just these 3 lines of code, we can use CSS Flexbox to center the text

display: flex;
align-items: center;
justify-content: center;

2. Grid (first type)

With just these 3 lines of code, we can use CSS Grid to center the text

display: grid;
justify-content: center;
align-content: center;

3. Grid (the second type)

The easiest way is to use only 2 lines of code

display: grid;
place-content: center;