How to Center Everything in CSS

In this article, I will tell you how to center everything in CSS. You can select a universal selector using star (*), which means it select all the HTML element in our document. And use the “text-align” property and give value as “center”. It means all the HTML element is going to be displayed center.

How to center horizontally

CSS:
</style>

*{
text-align: center;
}

HTML:

<h1>This is Heading text</h1>
<p>This is paragraph text</p>
<span>This is span text</span>
<div>This is Div text</div>
<a href="https://wonderdevelop.com">Click here to see</a>

Output:

In the above code have <h1>, <p>, <span> and <a> tag. As I want to center all these HTML elements, I am using a universal selector to center all HTML elements using the text-align property. You can also center HTML elements vertically using the justify-content property and give value as “center”. When you use this you need to set the display property to flex.

Another method is you should create all the HTML elements inside the <center> tag, it will automatically all the content to the center.