Streaming live at 10am (PST)

Bottom of designer cut off


#1

The designer is cutting off the bottom of this website. Should be 100 pixels on the bottom, but I can’t scroll any further down.


#2

Hi @DigtalCrusader, thanks for the report on this, sorry to hear of the trouble. So that we may take a look, could you please share the read-only link to the site? https://university.webflow.com/article/how-do-i-share-my-sites-read-only-link

Thanks in advance.


#3

I’m having the same issue in my designer on my most recent website that I am working on. This happened when I copied and pasted the footer section from the home page to my other pages on the site. On my other websites that I have saved in webflow I’ve tried the same actions and I don’t encounter this problem.

Any help and resolution from the webflow staff would be much appreciated!

https://preview.webflow.com/preview/miracle-seed?preview=97009adc706d8458e5b5c9407ae37319


#4

Hi @DigitalCrusader!

This definitely seems like odd behavior, and I’m happy to investigate so you can get back to awesome web design!

Sometimes style settings can interfere with the way they are displayed (and accessed) within the Designer. I notice your footer isn’t set to relative positioning. Could set it Positioning: Relative and have a width of 100% for the footer?

Next, try setting the Body height to 100% with Overflow: Visible.

Here’s a GIF I recorded showing the steps on my end: https://cl.ly/45223z3m0E1C

Let me know if this fixes the problem – if not, I’m always happy to help further!


#6

Hey @Andrew I’ve tried the steps that you’ve outlined and they do not change anything. The footer is still cut off. BTW, this happens in the chrome browser and it works fine in Safari.

I don’t understand why the footer in the home page is showing fine in designer in chrome but for the other pages the footer is partially cut off?


#8

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


Footer disappears/changes height
#9

Hi @fittersift and @DigtalCrusader, the behavior with the bottom of the designer getting cutoff is due to collapsing margins, take a peek here: https://www.sitepoint.com/collapsing-margins/

For now, the solution is to remove the margin-top between any element and the body and and instead use padding-top instead.

I hope this helps.


#10

#11

Thanks for following up @cyberdave, it helps :slight_smile:


#12

Hey @andrew @cyberdave. I’m just about wrapping up the website I’ve been working on back and forth and I just ran into a problem and I was hoping I could get some help. On the “Our Process” page the “Our Process” section height is set up to fit perfectly on mobile but it is being cut off in the designer console. None of my other pages have this problem.

Any idea of how I can fix this?

fyi, I’m getting the same cut off on multiple web browsers.

https://preview.webflow.com/preview/miracle-seed?preview=97009adc706d8458e5b5c9407ae37319


#13

Also, I just used the webflow designer console in Safari and when I click on any element the page goes blank.

What’s up with that?


#14

@cyberdave and @andrew. I figured out the problem guys! I had to the width for for the text in the section so it wouldn’t elongate.