🤩 New Cool Developer Tools for you. Explore →
FREE JavaScript Video Series Start Learning →
FLAT 75% OFF All Interactive courses at flat ₹250 / $3.25 only. HURRRRRY!! Explore now
  Signup/Sign In
Tests
MCQs to test your knowledge.
Forum
Engage with the community.
Compilers
Compilers to execute code in browser.
← Back to Questions
Ask Question
Not satisfied by the Answer? Still looking for a better solution?
Ask Question

How to center text (horizontally and vertically) inside a div block in HTML?

I have a div set to display:block (90px height and width), and I have some text inside.

I need the text to be aligned in the center both vertically and horizontally.

I have tried text-align:center, but it doesn't do the horizontal part, so I tried vertical-align:middle, but it didn't work.

Any help?
css html
by

2 Answers

RoliMishra
#container {
display: flex;
justify-content: center;
align-items: center;
}
pankajshivnani123
ive this CSS class to the targeted <div>:


.centered {

  width: 150px;

  height: 150px;

  display: flex;

  align-items: center;

  justify-content: center;

  text-align: center;

  background: red; / Not necessary just to see the result clearly /

}





<div class="centered">This text is centered horizontally and vertically</div>

Login / Signup to Answer the Question.

LoginSignup