Buttons changing size

Because for some odd reason you have a script which adds ‘active’ class on click, and this is styled with different padding in your theme https://glui.me/?i=xqpkxk9wrsld7pl/2016-03-16_at_00.19.png/

This is not caused by WooCommerce.

Ugh, yes! Sometimes the easiest things are the hardest to figure out. Thanks!!!

So, I did it again! Ugh. Your image response isn’t available – where was that again?

Here’s the new site: https://playsinmorris.org/plays/product/princess-diana/?attribute_date=MAY+19+%40+7%3A00PM

Thanks!

Try this custom css to overwrite that part of your theme’s css:

.art-button.active,
.art-button.active:hover {
  padding:.618em 1em;
}

Custom css can be entered at:
Dashboard > Appearance > Customise > Additional CSS

Worked – thanks!

Spoke too soon … looks like my ‘regular’ buttons get funky when you click them:

https://playsinmorris.org/plays/sponsors/

Do you know where I would delete what is affecting the Woocommerce buttons. I know that’s what I did last time, but I forgot how?!

The theme styles are affecting the WooCommerce buttons. Edits to the theme style sheet will be overwritten by theme updates, so that’s not a good way to go.

Try this instead of the above:

.product .art-button.active,
.product .art-button.active:hover {
  padding:.618em 1em;
}

Thanks again!