DAWN THEME: Center product details beneath product image

Store Design
1

I’m trying to center the product title and pricing details beneath the Featured Products and Collection pages. I’ve tried as suggested to insert this code on the component-image-with-text.css file under Assets, but nothing happens:

@media only screen and (max-width: 749px) {
.image-with-text__text {
     margin: 0 auto !important;
  text-align: center;
}

@media only screen and (max-width: 749px) {
.image-with-text__heading {
  margin: 0 auto !important;  
  text-align: center;
}

  @media only screen and (max-width: 749px) {
.image-with-text__content .button {
  margin: 20px auto !important; 
  text-align: center;
}

Any ideas? Thank you!

Soukcouture_0-1637558222200.png
Soukcouture_0-1637558222200.png2362×1142 183 KB

2

@Soukcouture , do this to fix it in 20 seconds:

  1. In your Shopify Admin go to: online store > themes > actions > edit code
  2. Find Asset > base**.css** and paste this at the bottom of the file:
[class*='collection'] .card-information__wrapper{
    text-align: center !important;
}

[class*='collection'] [class*='card-information'] .price{
    align-items: center !important;
    justify-content: center !important;
}

Kind regards,
Diego

3

Amazing! Thank you so much for your fast help!!

4

How come this isn’t working with the new version of this DAWN theme? Can you help me here? The Price is aligned but the product card title isn’t.

https://themes.shopify.com/themes/dawn/styles/default/preview

1 Like