Good afternoon, how are you? I was able to center the header for the product slider but I can’t get the price to center. Can you help out? I searched the forum but can not find anything.
Thank you for your help.
Hey janton1,
Please try this code in the General Styling > Quick CSS field:
.template-shop.avia-content-slider .inner_product_header_table {
display: flex!important;
justify-content: center!important;
}
Best regards,
Mike
Thank you for the code but it still isn’t exactly centered. Please look at the Mas Dink Gear section on the dev site link home page. You can see it isn’t centered.
Thank you for your help.
Hi,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:
CSS Snippet:
/* CSS - Center pricing */
#top.home .<a href='https://refer.wordpress.com/r/84/woocommerce/' target='_blank' rel="nofollow">woocommerce</a>-Price-amount.amount {
display: inline-block!important;
width :100%;
text-align: center;
background: gold;
}
You can remove the background color. It is used for visual reference in the code :)
Please note: If you do not notice any change after adding the code please perform the below steps to clear the browser cache:
1. Disable “merging and compression” for CSS and JS files from Enfold > Performance.
2. If a caching plugin is installed check the plugin settings and clear the cache and deactivate the plugins for testing purpose.
3. Hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload”.
Result:
Best regards,
Vinay