Make front page cover page fit

I have changed my website cover pic and it no longer fits the web page. I had this issue with my previous pic but managed to fix it. Can someone help. Dawn theme. www.peakclo.com

Hi @peakclo

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > base.css and paste this at the bottom of the file:
.banner__media.media > img {
    object-fit: fill!important;
}

Hello @peakclo
Go to online store ---------> themes --------------> actions ------> edit code------->assets-----> section-image-banner.css

@media screen and (min-width: 750px) {
.banner--small:not(.banner--adapt) {
min-height: 60rem !important;
}
}

result

If this was helpful, hit the like button and accept the solution.
Thanks

I resized the image and put in the code you shared which looks good on desktop. For mobile the pictire is really squashed

Do you have any resolution

I put this in but it did not work

Hi @peakclo

Please open base.css file, find this code

.banner__media.media {
   max-width: 1100px;
   top: unset!important;
   left: unset!important;
}

Replace it with this

.banner__media.media {
   max-width: 100%;
   top: unset!important;
   left: unset!important;
}

Sorry, I dont like this layout. I put this code in myself to change away from that.