Text columns with images on one line on mobile - Pipeline theme

Store Design
1

Hi,

I’m trying to get text columns with images to stay on one line on mobile. I’ve managed to get it to stay on one line on desktop but I can’t do it on mobile. Is there also a way to make the images much smaller and the text larger, more similar to my old style.

URL is www.indierefill.com

desktop
desktop2400×1022 229 KB

mobile
mobile1284×2778 203 KB

old style
old style2158×408 45.8 KB

2

@Jomiguens

can you please confirm this look?

KetanKumar_0-1634367783778.png
KetanKumar_0-1634367783778.png1920×1080 331 KB

3

Is it possible to go any smaller at all? Or does it cause issues with the text underneath?

4

hello @Jomiguens

please Go to Online Store->Theme->Edit code then go to assets/style.css ->paste below code at the bottom of the file.

@media only screen and (max-width: 750px){
.homepage-columns.section.bg--neutral .wrapper .grid {
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.homepage-columns.section.bg--neutral .wrapper .grid .index__column {
     padding-left: 0px ;
} 
.homepage-columns.section.bg--neutral .wrapper .grid  .lazy-image.column__image {
    min-height: 70px;
    max-width: 50px;
    margin: 0px auto;
}
 .homepage-columns.section.bg--neutral .wrapper .grid .home--uppercase {
     font-size: 15px;
     padding: 8px 2px;
}
}
5

thank you so much!