Section height not coming through on phone

Hey hey

The footer section looks good in the phone preview in the editor, however when i load it up on my phone (iphone 7): it looks like it doesnt use the given 110vh height. Been trying a lot of things, cant seem to fix it. Please help.

Thanks!
Mart


Here is my site Read-Only: https://preview.webflow.com/preview/martijns-awesome-project?utm_source=martijns-awesome-project&preview=1d393d3b5be09826a01fd0fb86ca853e

site: www.mmcreated.com

May I ask why do you use fixed height section at all?

It generally works for me… I don’t really know how else to do it. I used it throughout the project, should i change everything up?

You shouldn’t change everything, just remove height from the footer, that is all. The height will automatically adjust to the content. Use paddings on the footer div to separate inner content from the borders

Well that worked :sweat_smile:, do you think i should do the same for the other sections?

Yes, don’t set fixed height when the content can do it itself! :smiley:

I’m sorry to keep you busy here, feel quite bad to ask so many questions. However if I don’t set a mad VH on the logo grid/colums: the thing goes outside of the section. I noticed it did this on the tablet view.

https://preview.webflow.com/preview/martijns-awesome-project?utm_source=martijns-awesome-project&preview=1d393d3b5be09826a01fd0fb86ca853e

Again, sorry for all these questions

Like @dram said - don’t use fix height. In general Use “min-height” instead.

You use too much “min-height” idea anyway (Use padding top/bottom and that’s it)

How you get this overlap again?

Arghhhh fixed it all, thank you so much!!!