Text Columns with Images in a single column for mobile

Store Design
, , ,
1

Hi Shopify Community,

I’m using the Pipeline theme version 7.2.2 for my Shopify store, and I need some help with the mobile layout of my text columns with images.

Currently, on mobile devices, the text columns with images are displayed side by side. I want to ensure that these columns stack in a single column for a better mobile user experience.

Could someone please guide me on how to achieve this? Is there a specific setting or CSS adjustment in the Pipeline theme that I should be aware of to make the text columns and images stack vertically on mobile devices?

Any advice or pointers would be greatly appreciated!

https://www.gitanokit.com/pages/concierge-service-your-custom-box

Thank you!

2

Hi,

Seems custom css will help

Example of css

/* For screens smaller than 768px (typical tablet and mobile sizes) */
@media (max-width: 767px) {
    .text-column {
        width: 100%; /* Ensure columns take full width */
        float: none; /* Disable floating to stack vertically */
        margin-bottom: 20px; /* Optional: Add space between stacked columns */
    }
}