Streaming live at 10am (PST)

Content div height 100% and columns inside also at height 100%



I wanted to ask a question that i have a long time ago.
I have a div container that has other divs inside it. (These are not row columns) I want these divs to always be the same height regardless of the content inside. I put the div container to 100% height and all the divs that are in there also at 100%. And what happens is that each of the divs has different sizes, depending on the amount of elements within each of them. If I specify an exact measure in px for the container div, everything works fine. However, I can’t specify an exact measure like 400px for example because I may have a lot of content in the divs that are inside and I run the risk that this content does not fit all there). How can I solve this? Why the system does not assume the 100% that I put? Do I have to enter some custom code to force it to have 100%?



Have you looked at flexbox yet?
Here’s a quick demo I made for you:

Here’s the preview:

And here’s the link to Webflow University about Flexbox


Hi jorn

Thank you so much! I’m new on this!
I will explore more!


Welcome, and we are many here to help you out.

Check my preview, but it is pretty simple.

A parent div is set to flex with align stretch and every child inside will stretch out to match the parent.

Good luck!

closed #5

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.