Cannot figure out how to center div in WordPress theme [closed]

As mentioned in my comment, http://howtocenterincss.com/ is a great resource to get the necessary CSS to horizontally or vertically center containers or paragraphs in CSS.

Since you mentioned the text should be centered, the wbesite would give you this solution:

<div style="text-align:center;">Text Content</div>

If you want to center a container instead, margin-right: auto; margin-left: auto; works fine too, but you need to set a width and make sure the element is not floated.

Looking at your site, the main problem you’re facing seems to be that your theme uses a grid system and the content only covers 8 of 12 columns in that grid:

Website screenshot

There’s two things you can do:

  1. Create a child theme and override the HTML to use the class col-1-1 instead of col-8-12. Then, use text-align: center to horizontally center the text only.

  2. Keep the col-8-12 class and set float: none; margin: 0 auto; for that element, e.g. using the .home #main .col-8-12 selector. You can do that via the customizer or in your child theme’s CSS file.