Quick add to button alignment in the home and collection page

[sahilsharma9515]

I have alignment issue in quick view button, I am using prestige theme and the issue is the button is not aligned an is not in 1 line when there are multiple products in collections, as some products have more information as compared to other.

Here is the preview link:
https://3d91eknx4q2qfael-2745001.shopifypreview.com/collections/all

Also on the home page the issue is when I am checking in the full screen it is showing correct alignment, but when seeing in the customizer is really distorted.

How can I fix it?



Screen Shot of the customizer home page issue:

[Mustafa_Ali]

<style>
@media screen and (min-width: 768px) {
.product-card__actions {
    margin-bottom: -30px;
    display: flex;
    justify-content: center;
    width: 100%;
}
</style>

hey @sahilsharma9515 try this one 

Go to online store ----> themes ----> go to three Dots ----> edit code ---->find theme.liquid files ----> place the code ---->
under the <style> tag before the body ----->
if this code work please do not forget to like and mark it solution

[sahilsharma9515]

Hi @Mustafa_Ali It's not working, when I am adding this code it's just messed up my home page design in mobile also the spacing in between the button and the text is way more that it's looking odd, but it solved the customizer problem, but I can't use it if it's messing up the mobile and homepage design.

can you please fix it?

[Huptech-Web]

Hello! @sahilsharma9515 Please follow these steps to add this CSS code:

1. Go to your Online Store
2. Click on "Themes"
3. Select "Edit code"
4. Open your CSS file. If you have a custom CSS file, open that instead.
5. If you can't find your custom CSS file, open "theme.css"
6. Add the following code at the end of the file.

body .product-card {
    height: 100% !important;
}

If you need further assistance, please let me know. If you found my help useful, consider liking this message and marking it as the Accepted Solution.
Best regards
K.K