Columns in a row not equal on height

Design help General
1

Hello guys.

The problem is that I have 4 columns in a row but in different monitors and platforms they don’t stay with current height. How can I adjust them to be fixed to the end of current section automatically?

Thank you

Here is my public share link: https://preview.webflow.com/preview/cyprustourismkiosk?preview=cddc4cfa12c94c7c3274a488f54d6f8b

2

Hey, thats a tough nut to crack. Theres a new css kid in town called flex box, not yet implemented in Webflow. With flex box the boxes takes the same height as the tallest one(and a bunch of other neat stuff). You could read up on flex box and add the necessary code but if that is to difficult I would go with a fixed height. And on smaller screens as they stack up use auto height instead.
Check this out: http://grid-test-0adfab.webflow.io/
Playground

2 Likes
3

Thanks @jorn for your reply but how can I apply a fixed height? I tried with the auto selection at margin and nothing happened. Do you have any ideas?

Hey guys do you know anything about this? @cyberdave @DragonDon
Thank you all

4

Doing a fixed height is the way I tend to manage this issue. I just do different heights on each device so they look good. On your site, select the parent div “features div” instead of the individual nested classes. Then set the height to a pixel height NOT a percentage height. Currently you have 0% set on the nested class so you’ll have to remove that as well.

Good luck!

1 Like
5

Thanks @DFink I managed to do it exactly as you said. Is there a chance of making the logo bigger but keep the navbar at the current size? and more at the left? :confused:

6

I can’t look at your site right now but it sounds like a pretty easy adjustment. I suggest you go watch all the videos over at tutorials.webflow.com and on the Webflow YouTube page. I watched every video before I even started working in Webflow and it saved a lot of time and a lot of questions on here. Good luck

7

This is fixed height. You decide how tall you want your div to be.

8

This is incredibly helpful. Thank you so much.

9

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