My section gets cut off in google chrome developer tools

Hey, my section gets cut off when testing it in Google Chrome. The first section that says “You Imagine It, I Create It” here’s my link.

https://preview.webflow.com/preview/mkhs-five-star-project-74d879e51e7b80ca?utm_source=mkhs-five-star-project-74d879e51e7b80ca&preview=398105e2b91e97df2792d1d26d25dadf

And here’s my site link.
https://www.mkhdevelops.com/

I don’t know… seems to be showing properly on my side.

Two things I notice though is your Navbar is inside of the hero section. There is a more effective way of doing this so you can style the elements within the hero section a lot nicer. See the images below:

What I would do now just from a design perspective is put some negative bottom margin on the Home Container to make up for the height of the arrow. Like this:

Hope this helps! :grin:

Thanks! Trying this now. And sorry I didn’t specify it cuts off in the mobile version and my container ends up changing position. Weird.

Moving the navbar outside of the section makes sense but then the background picture doesn’t go to the top of the screen. The navbar becomes white and the background picture is moved down. Any ideas ?

Did you make sure to set the Position to Absolute?

Ahhhh got it!!! Thanks !

1 Like

Here is a video I made so you can see: https://cl.ly/99edd73bbc0e

My pleasure :slight_smile:

Thanks man. Just watched the video. Looks great in google chrome developer tools now

Awesome! Glad to hear that! Cheers!