Trying to find code to fix issue with mobile

Hi

I'm running off of the Henson template. I've noticed that the featured image that hovers for each page section in the navigation gets cropped or cut off awkwardly when viewing in mobile.  Does anyone know a code or solve to have the featured page image scaled down when viewed on a mobile device? See screenshot example below

Thank you!

Greg

@GregR You could try this in custom css. It should center them right in the middle and make the whole thing show on mobile. This doesn't shorten the section though so it keeps your navigation at the bottom and fills the screen.

@media only screen and (max-width: 640px) {
  .collection-images .image-container {
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain;
  }
}

Hi @jaeveedee

Thanks for the quick response! Just gave it a try but unfortunately it still crops the images.

It seems to just allow me to swipe the hav bar down.

Any thoughts?

Thanks again!

Greg

Is the code still in there? If not can you put it back?

Hi @jaeveedee

Sorry I just saw this. I've put it back just now.

Thank you!

Greg

@jaeveedee

Nice!!! It totally worked. Thank you so much! I've been trying to fix this for months. I really really really appreciate it!