Change padding on add-to-cart button

  • Resolved swisspenelope

    (@swisspenelope)


    4 years, 7 months ago

    Hi again

    I have once again tried all sorts of things I have found on the web for this, to no avail. My latest attempt is:

    .woocommerce ul.products li.product .button {
	padding: 3%;
}

    (I don’t know if I want as much as 3%, but I would just like SOMETHING to happen when I add my CSS.)

    What am I doing wrong here?
    Thx
    PH

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi, there isn’t any add to cart buttons on the URL that you linked? Are you talking about on a single product page you want to change the button padding there?

    If so, you could use the following CSS

    .single .product .cart .single_add_to_cart_button {
  padding: 10px;
}
    Thread Starter swisspenelope

    (@swisspenelope)

    Sorry! While I was waiting for a reply I was trying out other Woocommerce settings and made that page show Categories not Products. I have put it back to Products again.

    If I understand your question about a “single product page”, then no, this is a general setting for each product offered. The Add to Cart link for each product must obviously be the same for all products.

    Thanks in advance!
    PH

    Thread Starter swisspenelope

    (@swisspenelope)

    Hi again,

    I found it in the meantime, and added my padding as follows:

    ul.products .wc-block-grid__product .button,
    .wc-block-grid__products li.product .button,
    .wc-block-grid__products .wc-block-grid__product .button {
      margin-bottom: 0.236em;
padding: 1rem;
	  }

    It’s quite tricky – some things are managed by Storefront and others by Woocommerce … am still finding my way around!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Change padding on add-to-cart button’ is closed to new replies.