How to get images to appear in a row instead of underneath

How to get images to appear in a row instead of underneath

WeAreHere
Tourist
10 0 4

Currently have two images with text overlay but they are stacking on top of each other but I would like them to display both on the same row.

 

This is for gift subscription and personal subscription here:

https://2erndh1sn8pnpwwh-66362147057.shopifypreview.com

 

There's also 4 images above that I would like the text to appear underneath instead of to the left hand side and have the images appear 4 in a row on desktop and 1 in a row on mobile.

 

Thanks so much,

 

Em

Replies 3 (3)

ZenoPageBuilder
Shopify Partner
1052 203 229

Hello @WeAreHere 👋

First of all, just want to say your store design is very creative, I like it a lot.

To make the 2 banners be next to each other, inside Shopify Admin, go to Themes, Edit code, open file theme.css (or theme.css.liquid, theme.scss, theme.scss.liquid) and add this code snippet at the bottom

 

@media (max-width: 1023px) {
#shopify-section-template--16498384437489__166429558283573843 {
    width: 50%;
    float: left;
}
}

The result on desktop

Screenshot 2022-10-28 at 09.53.34.png

If you want to apply it on mobile also, just remove the @media wrapper from the code, but I think it is better to leave the mobile version unchanged. Hope that helps!

Zeno Page Builder - Build responsive & SEO-optimized Landing pages, Blog posts, Product pages and more...
Learn more at zenobuilder.com
WeAreHere
Tourist
10 0 4

Thanks for the kind words!

 

I've popped the code in but unfortunately it hasn't changed anything.

 

It's under - assets - theme.css

 

Any ideas what I might be doing wrong?

 

Thanks!

ExpertRookie
Shopify Partner
1518 249 324

Hi @WeAreHere
In this case you can try to find settings in section theme setting.
If the theme does not support for the layout as you want, I think we need to update in the theme code to make your page looks good on all devices.

- Was my reply helpful? Please Like and Accept Solution to let me know!
- Want to modify or custom changes on store Hire me.
- Feel free to contact me on expert.rookie.team@gmail.com regarding any help.