Centering page elements

No matter what I do, I cannot get the following page elements to center on the page: https://www.highperformingculture.com/fundamentals-system-overview/

Here’s the text:

[x_audio_player mp3="https://www.highperformingculture.com/wp-content/uploads/2018/11/Fundamentals-System-Overview.mp3"]

Download

Hello @AdmanCEO,

Thanks for writing in! The row styles were disabled. This is why you cannot center the contents. Please go to WPBakery Page Builder > General Settings and enable the “Legacy X Integration”.

We would loved to know if this has work for you. Thank you.

Legacy X Integration Was already checked one I created this page but I still can’t get the elements to center

Hello Sean,

Hope you had a nice weekend.

Please try adding this code to the style option of the column container.

margin: 0 auto; float: none

Hope this helps.

Added the code but no change in result — everything is still flush left.

Hi Sean,

I have checked the page and it doesn’t have any indication that the code was added to the column.

Would you mind providing the admin access to your site in a Secure Note (key icon under the replies you post/posted) so that we can check:

Hope this helps.

Hi Sean,

I have gone ahead and added the inline CSS code to the style option of the column.

Please see the screenshots below to see where it’s supposed to be added:

Hope this helps.

Thanks for the clarification and your direct input. Just so I know, do I have to add this code to every text block from this point forward? Why doesn’t the center command work anymore?

Hi again,

An easy way would be to add the following code in the Theme Options > CSS:

.center-element {
    margin: 0 auto; 
    float: none
}

Then simply assign a class center-element to the columns.

Hope this helps!

I’m a little confused. I’ve been using the X Theme for several years with several websites. With this latest update did someone actually decide that the ability to “center elements within a column” just isn’t that necessary anymore? What’s next, removing the ability to bold text??

Hi,

The ability to center wasn’t removed. It’s the way you have build the page.

I can see you have three columns, with two empty columns on each side.
This makes your columns float to left and because the first column is empty, the second column floats to far left.

Please change the three columns to just one column and the column center element will work as it should.

You can limit the width of your audio element by adding an inline style.

[x_audio_player style="max-width:500px;margin:0 auto;" mp3="https://www.highperformingculture.com/wp-content/uploads/2018/11/Fundamentals-System-Overview.mp3"] 

Hope that helps

Okay, that makes sense. Appreciate your quick response.

You are most welcome. :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.