Interestingly, the cropping gets smaller (disappears altogether) when resizing the browser window to smaller width.
Ok, found one solution working for modern browsers:
.post-image-bg {
width: 100% !important;
height: 40vw !important;
}
where 40vw for modern browsers means 40% of the viewport width. Obviously you can vary 40 to meet your needs
Hello @lsv-grenzland,
We are writing CSS like this way, any size image will fit in the outer box
this method call ‘object-fit: cover’ in this method image will fit in the box and overflow image part will hide in this method any size image look good without pressing or stretching.
If we give image size width:100% and height:100% forcefully to fit it then image will press if the image is bigger then box and image will stretch if the image size is smaller then box
If you want a perfect image slider then please upload outer box size image (width:1180 and height:350).
Thanks
Hello,
If you want the same image as you have uploaded, please use the below CSS under custom css section.
.recent-post-slider .post-image-bg img
{
height:auto !important;
object-fit: unset !important;
}
