Responsive image but keep width and keep height

Question

Okay basically, i want to make my banner responsive. so just changing the window size and the image doesn't resize, however it doesn't allow yout to scrol.

Before resize:

After resize:

And this is what i dont want to happen on window resize:

Answer 1

Set the banner image as a background and give it the following CSS:

background-size: cover;

Source: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Background_and_Borders/Scaling_background_images