Solved

Image with text section not working on Shrine Theme

robertbarta
Explorer
64 0 14

Hello, I am using a Shrine Theme on my Shopify store, and for some reason, the "Image with text" section isn't working correctly. Is anyone able to fix this? 

what is should look like.png

Accepted Solutions (2)
webwondersco
Shopify Partner
1103 164 162

This is an accepted solution.

@robertbarta PLease add the below line of CSS code at the end of your theme.liquid file. Just copy and paste this code just above the  </body> tag.

 

<style>
.image-with-text__grid{
align-items: stretch;
}
</style>

 

Result:

 

webwondersco_0-1713693307807.png

 

 

Web Wonders | Shopify Partner | Connect here!
- Question answered? Mark as Accepted Solution, reply helpful? Click Like
- Hire me, if you want to design, re-design, develop a store, or make changes to the pre-built store.
- a small Coffee Tip would be greatly appreciated. :)..! Instagram

View solution in original post

TerenceKEANE
Shopify Partner
389 72 62

This is an accepted solution.

Hi,

 

Using fixed values should be avoided. Otherwise, it may cause inconsistency in size when the screen size changes.

The following code will do what you want. If you encounter any issues again, feel free to write, I'll help.

 

1) Navigate to the 'Edit Code' option in your theme settings, then search for 'theme.liquid' in the search bar.

2) Paste the following code below the '<head>' tag. Please refer to the attached screenshot for guidance.

shopify.head.jpg

 

<style>

.section-template--16601856376987__image_with_text_RhiNBH-padding > .image-with-text__grid--reverse {
    align-items: unset !important;
}
  
</style>

 

Terence

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ If I helped you, Please don't forget to Like and Mark Solution to the post that helped you. --> Our Website
If my support was a lifeline for you, The COFFEE   would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> info@novajetsoft.com | Software Engineer - Specializing In Advanced E-Commerce Websites

View solution in original post

Replies 6 (6)

webwondersco
Shopify Partner
1103 164 162

@robertbarta Hope you are doing well.

 

could you please share your store URL?

Web Wonders | Shopify Partner | Connect here!
- Question answered? Mark as Accepted Solution, reply helpful? Click Like
- Hire me, if you want to design, re-design, develop a store, or make changes to the pre-built store.
- a small Coffee Tip would be greatly appreciated. :)..! Instagram
robertbarta
Explorer
64 0 14
webwondersco
Shopify Partner
1103 164 162

This is an accepted solution.

@robertbarta PLease add the below line of CSS code at the end of your theme.liquid file. Just copy and paste this code just above the  </body> tag.

 

<style>
.image-with-text__grid{
align-items: stretch;
}
</style>

 

Result:

 

webwondersco_0-1713693307807.png

 

 

Web Wonders | Shopify Partner | Connect here!
- Question answered? Mark as Accepted Solution, reply helpful? Click Like
- Hire me, if you want to design, re-design, develop a store, or make changes to the pre-built store.
- a small Coffee Tip would be greatly appreciated. :)..! Instagram

PageFly-Amelia
Navigator
317 96 139

Hello @robertbarta 

This is Amelia at PageFly - Shopify Advanced Page Builder app.

 

You can try the following steps I have provided to help you solve the problem you are facing:

Step 1: Online Stores > Themes > Edit code

Step 2: Choose file base.css

Step 3: Add code

.image-with-text__text-item {
   height: 645px;
}

 

Hoping my solution helps you solve your problem.

Best regards,

Amelia | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.


Optimize your store’s mobile shopping experience with the Blum theme.

robertbarta
Explorer
64 0 14

i don't have that file for some reason

TerenceKEANE
Shopify Partner
389 72 62

This is an accepted solution.

Hi,

 

Using fixed values should be avoided. Otherwise, it may cause inconsistency in size when the screen size changes.

The following code will do what you want. If you encounter any issues again, feel free to write, I'll help.

 

1) Navigate to the 'Edit Code' option in your theme settings, then search for 'theme.liquid' in the search bar.

2) Paste the following code below the '<head>' tag. Please refer to the attached screenshot for guidance.

shopify.head.jpg

 

<style>

.section-template--16601856376987__image_with_text_RhiNBH-padding > .image-with-text__grid--reverse {
    align-items: unset !important;
}
  
</style>

 

Terence

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ If I helped you, Please don't forget to Like and Mark Solution to the post that helped you. --> Our Website
If my support was a lifeline for you, The COFFEE   would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> info@novajetsoft.com | Software Engineer - Specializing In Advanced E-Commerce Websites