Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Add to Cart button size


maskiner

Question

Site URL: https://www.hamiltonworkshop.com/

Hi

I´m having trouble with the "add-to-cart" button in a product block with 4 columns.

When customers press the button, the "Adding - Added" animation breaks the grid of my product blocks - see image.

The initial width of the add-to-cart button is based off my viewport size - I guess - How do I keep it that way?

It seems to revert to at standard width after pressing the button?

Screenshot 2021-05-21 at 10.42.18.png

Link to comment
  • Answers 8
  • Created
  • Last Reply

Top Posters For This Question

8 answers to this question

Recommended Posts

  • 0
On 5/25/2021 at 5:16 PM, maskiner said:

@tuanphan you are wonderful - thanks for your help

Do you need to solve these?

Site URL: https://www.hamiltonworkshop.com/

1. (Tablet-Homepage) Increase width or change to 2 items/row?

hamiltonworkshop.com-01-min.png

2. (Mobile-Homepage) change to 2 products/row?

hamiltonworkshop.com-02-min.png

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
20 hours ago, maskiner said:

It solved it on desktop, but as you point out, not on tablet and mobile.

How do I change to 2 products/row on tablet and mobile?

Thanks in advance

Add to Design > Custom CSS

/* tablet-mobile products */
@media screen and (max-width:991px) {
div#page-section-5fb24f0f844f9e409ec54198 .span-3 {
    width: 50% !important;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...