A user is experiencing alignment issues with comparison app tabs appearing below product cards in their Shopify store. The tabs are not properly aligned across different product cards, creating a visually inconsistent layout.
Proposed Solution:
.card__content .card__information to use flexbox with column direction.card__content .card-information fill 100% heightThis CSS modification should standardize the card heights and align the comparison tabs consistently across all product cards. A store preview link and screenshots were provided showing the misalignment issue and the suggested code implementation.
Hi everyone,
I added a comparison app in my store, but my problem is the alignment of the tabs below my product cards. Is there a way to align these tabs? See photo for reference
Store Preview Link: https://bgtz765ufz7gbbgl-13830324282.shopifypreview.com
Hi @IntechCarl ,
Go to Online Store > Themes > Actions > Edit Code > base.css
Add below code at the bottom of base.css file
.card__content .card__information {
display: flex;
flex-direction: column;
}
.card__content .card-information {
height: 100%;
}
