[Resolved] Center align add to cart field and button

[Alexandre]

Hi,

I’m struggling with centered alignment on single product page with Add to cart and field on mobile display.

Here is what I have actually :

@media (max-width: 768px) {
    .woocommerce div.product .product_title,
    .price,
    .posted_in,
	.woocommerce div.product form.cart {
		text-align: center;
	}
}

but I can’t figure out how to align field & Add to cart button

Thanks your excellent support, as usual !!

GeneratePress 2.2.2

GP Premium 1.7.7

[Tom]

Hi there,

Try adding this CSS as well:

@media (max-width: 768px) {
    .woocommerce div.product form.cart div.quantity,
    .woocommerce div.product form.cart .button {
        float: none;
        display: inline-block;
    }

    .woocommerce div.product form.cart .button {
        margin-top: -4px;
    }
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Alexandre]

Excellent,

Thanks a lot

[Tom]

You’re welcome 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts