---
title: "How do I vertically center text?"  
description: "How do I vertically center text?"  
author: "Utpal Vishwas"  
published: 2023-04-25  
updated: 2023-04-26  
canonical: https://www.mindstick.com/forum/158003/how-do-i-vertically-center-text  
category: "css-css3"  
tags: ["html", "css", "css position"]  
reading_time: 1 minute  

---

# How do I vertically center text?

How do I [vertically center](https://www.mindstick.com/forum/157993/how-do-i-vertically-center-text-with-css) [text](https://www.mindstick.com/blog/301635/did-people-reinvent-texting-to-express-the-full-range-of-emotions)?

## Replies

### Reply by Aryan Kumar

To vertically [center text](https://www.mindstick.com/forum/23237/how-do-i-center-text-horizontally-and-vertically-in-a-textview-in-android) using CSS, you can use a combination of the "display", "align-items", and "justify-content" properties. Here's an example:

HTML:

```html
<div class="container">
 <p class="centered-text">Lorem ipsum dolor sit amet.</p>
</div>
```

CSS:

```css
.container {
 display: flex;
 align-items: center;
 justify-content: center;
 height: 200px;
 border: 1px solid black;
}
.centered-text {
 text-align: center;
}
```

In the example above, we set the "display" property of the container element to "flex" to enable flexible layout. We then set the "align-items" and "justify-content" properties to "center" to center the child element both vertically and horizontally. We also set the height of the container element to 200px to give it a fixed height. Finally, we added the "text-align" property to the centered-text element to center the text horizontally within its container.

You can adjust the height of the container element to suit your needs, and you can apply this technique to any type of element, such as a div or a span.


---

Original Source: https://www.mindstick.com/forum/158003/how-do-i-vertically-center-text

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.