Make image take up more width on desktop

Ask the Community Customization
1

Hello! Is there a code snippet I can add to make the event image take up more width, rather than the event details?

image

3

Hi there, @lilykgamble :waving_hand:

You just need to fix the image cropping, right?

If so, please try to use this CSS code and let me know if you like the result:

.eapp-events-calendar-media-image {
  object-fit: fill!important;
}
4

Hi Max!

That helped with the cropping, but I also wanted the image side to take up more of the width and reduce the info section’s area:

Screenshot 2026-09-29 at 8.19.19 AM
Screenshot 2026-09-29 at 8.19.19 AM1372Ă—488 271 KB

5

Got you!

This CSS code should help:

.eapp-events-calendar-slider-item-big {
  --image-width: 70%;
}

.eapp-events-calendar-slider-item-info {
  width: calc(100% - var(--image-width)) !important;
}

.eapp-events-calendar-slider-item-imageContainer {
  width: var(--image-width) !important;
  left: calc(100% - var(--image-width)) !important;
}

Give it a try and let me know how it worked :wink: