HomeОбразованиеRelated VideosMore From: Alex

How to Vertically Align Text by Using CSS (line-height)

18 ratings | 1712 views
In this tutorial, I show you how to vertically align text by using the line-height CSS property. LINKS Files: https://github.com/almanzanoex/YouTube/tree/master/How%20to%20Vertically%20Align%20Text%20by%20Using%20CSS%20(line-height) GitHub: https://github.com/almanzanoex/YouTube AFFILIATE STUFF (thank you for the support!) 💰 I am an Amazon Affiliate and by using these referral links you can support this channel. HTML & CSS Book (recommended): http://amzn.to/2vGYBEa Javascript & jQuery Book (recommended): http://amzn.to/2vGiXNM PHP Book: http://amzn.to/2uGQQ3O DELL XPS 15 (my laptop): http://amzn.to/2fJEQaQ Blue Yetti Microphone (my mic): http://amzn.to/2w06eb8 Amazon Echo: http://amzn.to/2fJGKbx Amazon Echo Dot: http://amzn.to/2wO4ejJ Thank you for using these links!
Html code for embedding videos on your blog
Text Comments (8)
Tony BP (10 months ago)
I'm a little confused, if I'm giving the text a line-height that's the same height of its containing div, wouln't it be at the bottom of the div? why does it only goes halfway? Thanks.
Alex (10 months ago)
you're welcome!
Tony BP (10 months ago)
Aaaahhh I see, so in your example 60px means 30px top and 30px bottom, got it. Thanks for the prompt reply, much appreciated :)
Alex (10 months ago)
+Tony CL line height is measured by the spacing around the text which includes top and bottom. So when you set the line height to some value such as 100px, then the spacing would be 50px top and bottom of the text causing the text to be in the middle of the div.
Gregory Tippett (7 months ago)
Yes! That answered my question exactly. Thanks!
Alex (7 months ago)
Glad to help!
Yassine Agrour (1 year ago)
thank u that s really helpful
Alex (1 year ago)
you are welcome!

Would you like to comment?

Join YouTube for a free account, or sign in if you are already a member.