Center Woo Commerce Items

Support
#1

Hi,

I’d like to center the photos and titles on the products in this WooCommerce page.

https://mountainviewvineyard.com/shop/

They were centered but then in an update became left aligned.

Also the top of the letters in the headline appears to be cut off.

Any help would be appreciated! Thanks!

#2

Hello @StickAndGrow,

Thanks for asking. :slight_smile:

To center align WooCommerce images please add following CSS:

.woocommerce .cols-3 li.product, .woocommerce.columns-3 li.product {
text-align: center;
margin: 0 auto;
display: block;
}

The reason Blog title is getting cut off is because of a custom code that you have added for cart icon in navbar. Please see the screencast https://screencast.com/t/Cafehn1CLzU

You can either remove the code or reduce the values to fix the problem. Here is the code:

.x-navbar .desktop .x-nav > li.x-menu-item-woocommerce {margin-left: 10px;}

Thanks.

#3

Hi Prasant,

Thank you! The centering code worked.

Please forgive my ignorance, but I’ve never done a website before and got in over my head with this theme. How do I get to the screen that you are showing in the screencast so that I can fix that problem?

Thanks!

#4

Hello There,

The screenshot is in the debug tools. To resolve your issue, please add the following CSS code in the X > Launch > Theme Options > Global CSS (http://prntscr.com/evui3r)

.x-navbar .desktop .x-nav > li.x-menu-item-woocommerce {
    margin-left: 0;
}

Hope this helps. Kindly let us know.