Div block options using width percentages

Design help Custom code
1

Hi There,
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?

thanks again

2

Yes, and in the best way possible.

Go to your site dashboard and click on the Share button

http://vincent.polenordstudio.fr/snap/2cq0t.jpg

With the preview link you’ll then grab, we can access you site within the designer, but in a read only mode. It’s neat.

3

Thanks! good to know… since I wrote this I think I may have the workaround by wrapping each block in it’s own div, thus preventing separate blocks floating left up beside the previous one.

1 Like