Here are commonly used ways to centre an element using CSS:
1. Using text-align: centre (for inline or inline-block elements)
CSS
.center {
text-align: center;
}HTML
<div class="center">
<!-- Your content goes here -->
</div>2. Using Flexbox
CSS
.center {
display: flex;
justify-content: center;
}HTML
<div class="center">
<!-- Your content goes here -->
</div>3. Using Margin Auto
CSS
.center {
margin-left: auto;
margin-right: auto;
display: block;
}HTML
<div class="center">
<!-- Your content goes here -->
</div>3. Using Grid
CSS
.center {
display: grid;
place-items: center;
}HTML
<div class="center">
<!-- Your content goes here -->
</div>