I have a page (https://test.deijsmannetjes.nl/ijstaarten) constructed of a number of similar sections.
Take as example the second section (with heading "Een ijskar op locatie").
I want the image on the left to always use 100% of the height of the section. And when the dimensions of the screen change, the aspect ratio of the image should not change; if nexessary the image will be clipped. I think it is what the css directive object-cover:fit does.
How can I do this in Pagebuilder?
object-cover:fit
Does not exist. Probably you thought about "cover" where the image will be clipped to fit.
Hi,
On the 2nd row you have Image addon.
Maybe better would be to set image as background on the left column, then you have more design options to choose from.
OR
Use Image content addon
OR
yes, you can use Custom CSS for every object, just use unqiue Section/Row ID Name and class name
#RowName .sppb-addon-single-image-container
#RowName .sppb-addon-single-image-container img {object-fit: cover;}If that may help you. Yes, I asked our developer to add "object-fit" as new option in upcoming updates.
This helped. Thnx.
But I am still struggling with the responsive behaveour of the section. But I will open a separate question for that.