I’m currently coding a site to be used with a separate CMS system. I want to give the client the option of using pre-styled div blocks to fill out pages.
So for example they could use a 33.33% div width image with a 66.66% text block or
a 1/3 image + 1/3 image + 1/3 image (all using percentages).
I have all 1/3 elements with a width of either 33.33% + max-width of 33.33%
or all 2/3 elements with a width of either 66.66% + max-width of 66.663%
everything is set to float: left.
It all works okay bar if a 2/3 div doesn’t have text content with the same or greater height of the 1/3 it’s floating to, the element underneath trys float up beside it.
To overcome this I cave the 2/3 div a min-height of 491px, which forces the div underneath to stay floated left of the screen. The only problem with this is it only works for one screen width, i.e. this is not a responsive option.
This is kinda hard to explain without showing my actual webflow page. Is there a way I can do this?