Shopify Dawn - Vertical Align Text On Featured Product - Desktop

Solved

Shopify Dawn - Vertical Align Text On Featured Product - Desktop

calmstrips
Visitor
2 0 1

I would like some assistance in getting the text in my featured product section to align vertically in the middle of the box. It aligns to the top, which looks a bit janky given the size of the image. Any assistance would be appreciated.

 

Screenshot 2024-04-26 at 9.37.34 AM.png

Accepted Solution (1)

ThePrimeWeb
Shopify Partner
2138 616 502

This is an accepted solution.

Hey @calmstrips,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.product__info-wrapper.grid__item {
    display: flex !important;
    align-items: center !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1714144430014.jpeg

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? [email protected] or check out the website
Check out our interview with Shopify!

View solution in original post

Replies 2 (2)

ThePrimeWeb
Shopify Partner
2138 616 502

This is an accepted solution.

Hey @calmstrips,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.product__info-wrapper.grid__item {
    display: flex !important;
    align-items: center !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1714144430014.jpeg

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? [email protected] or check out the website
Check out our interview with Shopify!

Emmalily
Tourist
7 0 1

the text alignment issue in your featured product section could be fixed with a bit of CSS. You can try applying display: flex and align-items: center to the container of the text, which should center it vertically in relation to the image. Adjusting the padding or margins might also help achieve the desired look. Hopefully, this gets everything looking more balanced!