Slider image cropping problem

[ykbaek]

Hi, i set Slider image for my page - https://kpopme.com/astro-where-have-you-been/

But depends on screen size, it shows very different.

The original image looks like this - https://ibb.co/nnAwgn
Blue guideline is where it gets cut on my screen.

For example, on my laptop it shows like this: https://ibb.co/cnhgE7 + https://ibb.co/kdDME7
But on larger screen (desktop monitor) it shows like this - https://ibb.co/mZQZZ7

Can we make the image responsive so that it shows the same on every screen without cutting any side.
Also, can you tell me the image size so that i can make with the size, please.

Thanks in advance!

[friech]

Hi There,

Thank you for writing in, regretfully that is how a background-image behave. I advise that you add that image to your page as an Image element instead of a slider.

I did check your slider and I think you just make that a slider so you can add the image? Add the image directly on the page instead, that will make your page lighter.

Please refer to the test page that I created.

Cheers!

[ykbaek]

Thanks for the reply.

But i would like to be full width image like slider, but when i upload top image as regular image,
it’s not the full width - https://ibb.co/kXTADc

could you let me know the image size i should be making?

Thank you.

[friech]

Hi There,

Image element is responsive to its Container. Please inspect your ROW (where the image is) and turn OFF the Inner Container option.

Also, make sure that your page is using a No Container | Header, Footer template.

When there is no Container that is limiting the Image, it will go fullwidth.

Cheers!