Image and button side by side on mobile

[Rio_Omnis]

Hi I am in need of making a section that places the picture and button side by side on mobile,

Any help would be much appreciated. I’ve gotten it to go side by side on desktop if I make it a multicolumn but even then on mobile it goes one under the other.

[DaisyVo]

Hi @Rio_Omnis

Please share the store link so I can take a closer look

Best,

Daisy

[Rio_Omnis]

Pete’s Rubbers

[DaisyVo]

HI @Rio_Omnis

To complete your requests, please follow these steps:

1. Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
2. Paste the code provided into the Custom CSS section.

@media screen and (max-width: 768px){
.multicolumn > .page-width {
    display: flex !important;
    justify-content: center;
}
.multicolumn > .page-width img.multicolumn-card__image {
    position: relative !important;
    width: 100px !important;
}
.multicolumn > .page-width  .media.media--transparent.media--adapt {
    width: 100px !important;
    padding: 0 !important;
}
.multicolumn > .page-width .multicolumn-card__image-wrapper {
    width: 100px !important;
}
}

Here is the result:

I hope this helps

Best,

Daisy

[Rio_Omnis]

Thank you so much! It worked! Question do you know why in some the button is not centered?