0

How to vertically center a text?

I am using a div tag i can center a text horizontal, but how can I center a vertically .. .. https://code.sololearn.com/W7nuyPxvzV8C/?ref=app

2nd Oct 2022, 4:34 AM
Nutee
Nutee - avatar
5 Answers
+ 8
Or use the flexbox-layout on the div. display: flex; align-items: center; justify-content: center;
2nd Oct 2022, 7:37 AM
Lisa
Lisa - avatar
+ 3
Just make line-height same as the div height e.g. line-height: 20vh; https://code.sololearn.com/WTU34IS6CycX/?ref=app
2nd Oct 2022, 7:08 AM
CalviÕ²
CalviÕ² - avatar
+ 3
You can also use the grid layout, instead of flexbox, and just write two lines of code. display: grid; place-items: center; You won't need the text-align property anymore, since the place-items property centers the content both horizontally and vertically.
3rd Oct 2022, 8:46 AM
Nico
Nico - avatar
+ 2
Use a span tag to format the text style (rather than the div style). In the style, use position:relative and specify distance from top (of parent element - the div) around 50%.
2nd Oct 2022, 5:16 AM
Emerson Prado
Emerson Prado - avatar
+ 2
display: flex; align-items: center;
2nd Oct 2022, 9:52 AM
Daniel Nwachukwu Chigozirim
Daniel Nwachukwu Chigozirim - avatar