We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more

How to align price tags in collections on Dawn?

Solved

How to align price tags in collections on Dawn?

GG9
Explorer
62 1 12

Is there some way to align all price tags in collections on Dawn? You'll see that by going on my site that there's some products with longer titles. Some prodcuts have a 3 row long title and some products only have a title that's 1 row long.

 

That results in the price tag being misplaced. Sometimes a bit higher or lower, depending on the products you're comparing.

 

Is there some way to add some space or anything that helps me avoid that?

 

My site: https://lhrn4x5dc5v6xk9n-57645498523.shopifypreview.com

Accepted Solution (1)

SagarSukhanandi
Shopify Partner
280 58 71

This is an accepted solution.

Hi @GG9 
Happy to help you with this issue
Please follow below steps

  • Step 1: Go to your Themes page. Navigate to Online Store > Themes. ...
  • Step 2: Click Edit code. In the Actions dropdown menu, click on Edit code to get to the code editor.
  • Step 3: Find the Assets folder for CSS files and edit the base.css file.
    Add the below style to the base.css file at the end

 

.card__information>.card__heading.h5 {
    min-height: 52px !important;
}

@media only screen and (max-width: 767px){
.card__information>.card__heading.h5 {
    min-height: 65px !important;
}
}​

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on sagar.sukhanandi@gmail.com regarding any help

View solution in original post

Replies 2 (2)

oscprofessional
Shopify Partner
16407 2444 3196

@GG9 ,

Can you share the screenshot.....

Hire us | Pass Core Web Vital | B2B Wholesale Experts | Claim Your Free Website Review |
Connect with Us: WhatsApp | Skype: oscprofessionals-87 | Email: pallavi@oscprofessionals.com |
Custom Shopify SolutionsPrivate Apps, Theme Customization & SEO | Digital Marketing |
OSCP Apps: Discount Suite | Wholesale App | Bundle & Upsell | Shipping Discount | and more...

SagarSukhanandi
Shopify Partner
280 58 71

This is an accepted solution.

Hi @GG9 
Happy to help you with this issue
Please follow below steps

  • Step 1: Go to your Themes page. Navigate to Online Store > Themes. ...
  • Step 2: Click Edit code. In the Actions dropdown menu, click on Edit code to get to the code editor.
  • Step 3: Find the Assets folder for CSS files and edit the base.css file.
    Add the below style to the base.css file at the end

 

.card__information>.card__heading.h5 {
    min-height: 52px !important;
}

@media only screen and (max-width: 767px){
.card__information>.card__heading.h5 {
    min-height: 65px !important;
}
}​

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on sagar.sukhanandi@gmail.com regarding any help