Responsive Webdesign section height

[EnzoG (Enzo Giannone)]

Hey Webflow Community,

I am totally new in webflow and just created the landigpage

https://preview.webflow.com/preview/ristorante-riviera?preview=73d2ad6f0220af37a6720bdeb1195023

I have an issue with the mobile view.

In the section ‘Willkommen im Riviera’ the height of the section is on desktop Perfect but on mobile iphone 6 too long. But Everytime i decrease the height the text of the section is on the iphone 5 in the other section ‘Auswahl unserer Speisen’?

What can i do to control this?

Thank you

---

Here is my public share link: [https://preview.webflow.com/preview/ristorante-riviera?preview=73d2ad6f0220af37a6720bdeb1195023]
(how to access public share link)

[zbrah (Mazette.co)]

Hi @EnzoG,

Your public share link doesn’t seems to work, can you take a look please ?

[EnzoG (Enzo Giannone)]

sorry @zbrah ,

this should work:

https://preview.webflow.com/preview/ristorante-riviera?preview=73d2ad6f0220af37a6720bdeb1195023

[EnzoG (Enzo Giannone)]

@zbrah i think the problem is margin and padding due to my not perfect css skills

[zbrah (Mazette.co)]

@EnzoG

Did you solved it ? Looks good on your Webflow link.
Ahah no problem, it happens
I think I would have hide the style div on mobile if i were you btw

Would be easier to read if it just took the entier div width i guess.
I also think you loose the menu card idea on mobile, so this grey div is not important.
Anyway great work so far

[EnzoG (Enzo Giannone)]

@zbrah Thank you

My problem is that in the editor on mobile view phone portrait the section with the gray background ends directly after the text “this is some text inside of a div block” but when i view the website with my iphone 6 there is much more space between text and the end of the section i hope you understand me.

when i check the mobile view with the chrome developer tools the space gets higher with iphone 6 plus etc…

what can i do to solve this problem.

thank you for your feedback

[zbrah (Mazette.co)]

Ok @EnzoG

It’s because you have a fix height on section2

Just give it height auto and play with padding

[EnzoG (Enzo Giannone)]

@zbrah

menu card idea on mobile, so this grey div is not important

thanks mate @zbrah now i solved it.

last question: how can i define that the grey div only appears on desktop not mobile? when i remove it from mobile it also removed from desktop.

thank you

[uzzer]

You set it to “display:none” in the mobile views, instead of deleting it.

[zbrah (Mazette.co)]

No problem
Yes just as @uzzer said

[zbrah (Mazette.co)]

@EnzoG

If it solved your question can you please check the solved box so the topic can be closed.
Thanks,