--- title: Center an Image Using Text Align Center --- ## Center an Image Using Text Align Center An `` element is an inline element (display value of `inline-block`). It can be easily centered by adding the `text-align: center;` CSS property to the parent element that contains it. To center an image using `text-align: center;` you must place the `` inside of a block-level element such as a `div`. Since the `text-align` property only applies to block-level elements, you place `text-align: center;` on the wrapping block-level element to achieve a horizontally centered ``. ### Example ```html Center an Image using text align center
John Doe
``` **Note:** The parent element must be a block element. If it is not a block element, you should add ```display: block;``` CSS property along with the ```text-align``` property. ```html Center an Image using text align center ``` **Demo:** [Codepen](https://codepen.io/aravindio/pen/PJMXbp) ## Documentation **text-align** - MDN **\** - MDN