Price aligned to the left on mobile

Hi,

on mobile the price is aligned to the left. I couldnt figure out which CSS I have to use to center it.

Could you please let me know which css I need to center the price?

Thank you.

Attachments:

You must be logged in to view attached files.

Hello,

I saw the screenshot you attached. Please try and add the following Custom CSS in the Custom CSS for mobile area under Theme Settings >> Custom CSS.

.product-grid-item .price {
text-align: center;
}

If it doesn’t work for you then provide the URL of the page to check it myself and help you out accordingly.

Best Regards.

Hello,

thank you. It doesnt do the trick.

Unfortunately I cannot send the live link due to privacy reasons. I tried to replicate the problem on a test site but there the problem doesnt occur (everything is centered). Do you have any idea what the reason could be for this?

None of these worked:

span.woocommerce-Price-amount.amount{
text-align: center;
}

p.price{
text-align: center;
}

/* center things */
div.summary-inner{
text-align: center;
justify-content: center;
}

On the test site this code is enough to center everything:

div.summary-inner{
text-align: center;
}

If I remove all css from the live site and only enter the code from above it center everything except for the price.

Hello,

If the price is centered on the test site it means that it is conflicting with some third party plugin. Please deactivate all the third party plugins and then Regenerate the CSS from WoodMart >> CSS Generator.

Clear cache and check back.

If the problem continues then provide with the admin panel login details of the live site in the private content area to check it myself and help you out accordingly.

Best Regards.

[Author]

Posts