Docs

[wanderinggourmet]

Hi there,

I have used code

.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {min-height: 520px !important; margin-bottom:10px; }
ul.products li.product a.button {position: absolute !important; bottom: 100px; }

to vertically align all of the add to cart buttons. This code works great besides it does not look good on mobile or tablet view.

How can I adjust for it to be responsive?

[Joao]

Hi There,

Let´s wrap your code in a media query, so use the code below instead:

@media (min-width: 769px) {
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {min-height: 520px !important; margin-bottom:10px; }
ul.products li.product a.button {position: absolute !important; bottom: 100px; }
}

Hope that helps

Joao

[wanderinggourmet]

Hi Joao,

Thank you for that.

Now, it’s weird because just the tablet version is not aligned.

I have attached a screenshot.

[wanderinggourmet]

..

[wanderinggourmet]

..maybe this one will work

[Lely]

Hi There,

Please resize the screenshot. Maximum size should be 512KB.
We’ll also need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[wanderinggourmet]

This reply has been marked as private.

[Jade]

Hi there,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

[Author]

Posts