Creating a new section and it overlaps

Design help General
1

Hi,

I’m new to Webflow and starting to create a site. I’ve got this far:
https://preview.webflow.com/preview/lumos-website?utm_medium=preview_link&utm_source=dashboard&utm_content=lumos-website&preview=04208352c8f4c677316a13763221e023&mode=preview

When I try and add another section below, why does it appear in the centre of the page and not below the second section?

Thanks,
Shonali

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

Hi,

Welcome to Webflow! This is because you have set your ‘Hero Section’ element to 30Vh. It will maintain this height, no matter what is in it. I would recommend:

  1. Select the Hero Section element and remove it’s height property.
  2. Select the yellow ‘Hero Section’ ‘Main’ element and set it’s top and bottom padding to 100px (or your desired effect).
  3. Drag in your next section element underneath and it will work!
1 Like
3

Hi Jason,

Thanks, I just tried that and the next section I drag in still lands solidly on the middle yellow section. Completely puzzled!

Shonali

4

Here’s an update. I tried it and it works, but with the padding set to 100 pix on top it appears fine on the designer. When I view it in the browser mode, there’s a gap between the main yellow hero section and the one below.

Is there a live chat help section with Webflow?

Shonali

5

Hi,

You must set your outer container ‘Hero section’ as height:auto.

54
54470×774 25.5 KB

6

Thanks, Jason. That seems to have worked.