Featured Product info not centered

Store Design
, ,

Topic summary

A user needed help vertically centering the product information section on their featured product display, as it was aligned to the top instead of being centered with the product image.

Solution Provided:
A CSS fix was shared to center the content using flexbox properties:

  • Add display: flex, align-items: center, and height: 100% to the .featured-product class
  • Can be implemented either through Shopify’s Custom CSS section in Theme Settings or by editing base.css directly in the theme code

Outcome:
The solution successfully resolved the alignment issue. The user confirmed it worked as intended.

Summarized with AI on October 31. AI used: claude-sonnet-4-5-20250929.
1

Hello, I would like my infos on the featured product to be centered to the photo and not glued to the top.

grangerly_0-1741714590708.png
grangerly_0-1741714590708.png1045Ă—715 393 KB

grangerly_1-1741714597194.png
grangerly_1-1741714597194.png1090Ă—773 529 KB

1 Like
2

Hi @grangerly

Please, share your store URL. Thanks!

3

https://xn–male-yqa.com.br/

password: shayne

4

Thank you.

https://xn–male-yqa.com.br/

password: shayne

5

@grangerly
Use this css

How to Add This to Shopify Dawn Theme:

  1. Go to Shopify Admin → Online Store → Themes.
  2. Click “Customize” on your Dawn theme.
  3. In the theme editor, go to “Theme settings” (bottom left).
  4. Scroll down and click “Custom CSS”.
  5. Paste the above CSS code and save changes.

Alternative (Edit Theme CSS Directly):

  1. Go to “Online Store” → “Themes”.
  2. Click “Actions” → “Edit code”.
  3. Open base.css inside the assets folder.
  4. Paste the CSS at the bottom and Save.
.featured-product {
    display: flex;
    align-items: center; /* Vertically center */
    justify-content: center; /* Horizontally center (if needed) */
    height: 100%; /* Make sure the parent takes the full height */
}

It will solve your issue.

If solved marked the post as solved and like to solution :slightly_smiling_face:
THank you

1 Like
6

It worked! Thank you so much.