How to create full size banner for different collection pages Desktop

Store Design
2

Hi,

Main issue it because you have verticle image on horizontal layout banner, for better result and for long term I encourage you to fix image to make it horizontal but following is a fix I can think of:

Find a file called component-collection-hero.css and change the update following CSS:

.collection-hero__image-container img {
    top: 50% !important;
    transform: translateY(-50%) !important;
}

to following by adding that new object-position property:

.collection-hero__image-container img {
    object-position: 50% 22%;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

change the second value (22%) to how much you want to position the image on the Y axis.