Rich text with image prestige theme

Solved
themuseclub
New Member
5 0 0

Hey guys,

I am so confused.

I added a new "rich text with image" section to the about us page. On mobile it shows the picture under the text, and i want to change that!

The weird thing is that one the homepage the same section shows the picture before the text on mobile.

Can you help me?

Here ist the page url: https://xh0ew6uyt8n8j7yn-52719714468.shopifypreview.com/pages/copy-of-behind-the-muse-club

Thank you!!!

0 Likes
LitExtension
Shopify Partner
641 66 119

Hi @themuseclub

Do you want to show like this screenshot: https://prnt.sc/11aufy4?

- If that's your idea. Please place this code at the end of the "theme.scss" file.

@media screen and (max-width: 767px)

    .FeatureText--withImage {

        display: flex;

        align-items: center;

        justify-content: center;

        flex-direction: column-reverse;

    }

    .FeatureText__ImageWrapper {

        width: 100%;

    }

}

Screenshot to refer: https://prnt.sc/11ausqh

Hope this helps! 

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
0 Likes
themuseclub
New Member
5 0 0

Hey @LitExtension ,

thanks for your help!!! But It didn't work, did I do anything wrong?

themuseclub_0-1618302923293.png

Thank you!!

 

0 Likes
LitExtension
Shopify Partner
641 66 119

This is an accepted solution.

Hi @themuseclub

Sorry for that. I'm missing '{' and '}'. Please remove old the snippet and add the new this snippet:

@media screen and (max-width: 767px) {

    .FeatureText--withImage {

        display: flex;

        align-items: center;

        justify-content: center;

        flex-direction: column-reverse;

    }

    .FeatureText__ImageWrapper {

        width: 100%;

    }

}

Hope this helps!

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
0 Likes
themuseclub
New Member
5 0 0

Hi @LitExtension ,

thank you so much, it worked!!!!!

Could you maybe help me with this point as well?

I want the rich text to have the same margins left and right as the other text, e.g. footer etc.

Link: https://www.the-muse-club.com/pages/test

 

Thank you so much!!!

 

 

0 Likes
LitExtension
Shopify Partner
641 66 119

This is an accepted solution.

Hi @themuseclub

You can try 2 ways below:

Way1: Please place this code at the end of the "theme.scss" file:

.template-page #main {

  padding: 0 24px;

}

@media (min-width: 768px) {

  .template-page #main {

    padding: 0 35px;

  }

}

@media (min-width: 1140px) {

  .template-page #main {

    padding: 0 65px;

  }

}

Screenshot to refer: https://prnt.sc/11fdwop

Way2: You can use selector has class "Container" to wrap the content of page like this screenshot: https://prnt.sc/11fe8lo

Hope this helps! 

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
0 Likes