Images cropped on desktop in Image with text, Pipeline theme,

Shopify Discussion

Topic summary

A user is experiencing image cropping issues in the “Image with text” section of the Pipeline theme. The problem only occurs on desktop view, while mobile displays correctly.

Troubleshooting attempts:

  • User has tried various CSS coding solutions without success
  • Another participant suggested adding CSS code to the Theme.css file targeting media queries and object-fit properties

Current status:

  • The proposed CSS solution did not resolve the issue
  • It caused images to stretch vertically on mobile and had no effect on desktop
  • The discussion remains open with no working solution identified yet

The conversation includes code snippets and the user shared preview links privately to help diagnose the problem.

Summarized with AI on November 10. AI used: claude-sonnet-4-5-20250929.
1

Hi there :slightly_smiling_face:

In the image with text section all looks fine on mobile but images are being cropped on desktop. Been trying different CSS coding but can’t find the right solution. Anyone here who knows what to do? Pipeline theme.

Kindest regards

Monika

2

Can You Share Site Preview Link

3

I’ll DM you

4

And then if you have a solution please post it here

5

Add This css in your Edit Code > Theme.css File

@media screen and (max-width:767px) {
        .image__hero__pane .object-cover{
            object-fit:fill !important;
        }
    }

See Solution :laughing:

Updating Media

6

Unfortunately didn’t work out well. That code stretched the images vertically on mobile and did nothing on desktop.