WooCommerce Add-to-Cart-Button display problems on Smartphone

Hi there,

please have a look at https://chateau-de-mur.swiss/preview and the go to WEINE > SHOP.
When you hover one of the thumbnails, a nice add-to-cart-button appears, like that:

Then, when a shrink the width of my browser to the smartphone-view, the button looks pretty ugly, like that:

Could you help me please with a few lines of css, please?

Hi There,

To fix this issue, please add this custom CSS under X > Theme Options > CSS:

@media (max-width: 768px){
    .woocommerce li.product .entry-header .button {
        padding: 5px 15px;
        width: auto;
        height: auto;
    }
}

Let us know how it goes!

This is exactly what I needed, thanks a lot!

May I ask you something else concerning this site? If you want to place an order, then the “i accepet the terms & conditions”-field is in english. I really want to translate just this part, but i don’t know how to do that…

@gabrieldesign.swiss, that is likely a string that is either within WooCommerce or a plugin you’re using to output that. You would need to use whatever program you use to translate strings throughout your site and alter it as needed. WooCommerce has some docs about doing this for their plugin here:

Hopefully that helps to point you in the right direction!

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