hi
if you look on my home page and collection page, the prices are not lined up the same level automatically. can someone help thanks
Topic summary
A user is experiencing misaligned product prices on their Shopify store’s homepage and collection pages.
Initial Solution (Collection Page):
- Made4uo-Ribe provided CSS code to add to main.css/base.css/style.css
- The code uses flexbox properties (display: flex, flex-direction: column, justify-content: space-between) to align card information elements
- This successfully fixed the collection page but not the homepage
Homepage Solution:
- PageFly-Richard suggested adding custom CSS to theme.liquid file above the tag
- Initial attempt didn’t work
Resolution:
- The issue was ultimately resolved after the user removed conflicting code from their theme layout liquid file
- The solution required cleaning up existing theme code rather than just adding new CSS
1 Like
Do you mean like this?
If it is check this one.
- From you Admin page, go to Online Store > Themes
- Select the theme you want to edit
- Under the Asset folder, open the main.css(base.css, style.css or theme.css)
- Then place the code below at the very bottom of the file.
.card__information {
display: flex;
flex-direction: column;
height: 18vh;
justify-content: space-between;
}
- And Save.
Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!
this works for the collection page, however now I want the same on the home page! thanks for your help
This is Richard from PageFly - Shopify Page Builder App
Please add this code to your theme.liquid above the to get this solved
Step 1: Online Stores > Themes > More Actions > Edit code
Step 2: click on theme.liquid and paste the code above the
Hope this can help you solve the issue
Best regards,
Richard | PageFly
1 Like
Did not solve the issue yet!
it did solve, i had to remove something in my theme layout liquid