Streaming live at 10am (PST)

Huge text 'frame' blocking content + open space under footer


#1

Hi guys!

Once again I need a little help. As you can see from the image below, the ‘Newsletter heading’ got a huge blue frame around it. I don’t understand why. I just copied the heading from another section, duplicated the class name, gave it a new class name, and made the size a bit smaller. The other big headings don’t have a frame like this, so why is this happening here? It looks to me that as soon as I scale the font down to standard H1 settings, the blue frame behaves normal… It’s when I reach 5.6 EM the frame ‘blows up’ like this.
The thing is…I need to do something about it, cause the frame is blocking the links in the cms in the section above.

Is there anyone out there who can help me with this? @Waldo maybe?

Also… footer…for some reason I got some open space under the footer. When I click on it, it looks like it is the Body. How can I remove this open space? I can’t see any settings showing that there should be a white open space at the bottom. But again… I might just have looking so hard that I’ve gone blind for any mistakes I’ve made… so please, please, please give me a hand.

My Share link: https://preview.webflow.com/preview/filigree?preview=43b6092a35c8a6d1379f0b07318817d1
Published site: http://filigree.webflow.io/


Here is my public share link: LINK
(how to access public share link)


#2

Thanks for posting this @Sven_Erik_Slattedale that definitely looks like odd behavior with the element outlines!

Can you please try the following:
(1) Try to reproduce the error while being logged into Webflow using Incognito mode with browser extensions turned off: https://support.google.com/chrome/answer/95464?hl=en
(2) If the problem persists, please take a screenshot of your Console and send it to me: https://developer.chrome.com/devtools/docs/console

Could you please let me know what browser version you’re using by sending me your information from this page?

There should be a small share link when you visit the page which you can send to me.

Thanks in advance!


#3

Hi @waldo , @samliew
and thank you so much for helping me out… again.

I did try to open it in Incognito window with all extensions turned off, and I still got the same problem.

I took a screenshot of the consol (hope I did it right), but didn’t understand if you wanted it from the designer or the publised page, so I took a screenshot from both of them.

When I’m at it, I’ve got an additional question for you. If I want to set a heading at absolute position, should this work with in the divblock/ section the heading is, or for the entire body? Some times the text just disappear, and other times it ends up at the very top of the page, even if the heading is suppose to be positioned like the heading we are currently talking about in this thread. (See img 3)

My browser version is: whatismybrowser.com/w/CH28JK8


#4

Any solution to this problem yet? @Waldo @Brando @AnnaKelian @samliew


#5

@Sven_Erik_Slattedale I noticed a few things that are causing issues:

  • You’re using set pixel heights on elements rather than a set width and auto heights (usually on the section elements
  • When elements are wider than the canvas width or go outside of their parent (like a text element outside of a section), that can result in side scrolling unless the section is set to 100% width, relative position, and overflow hidden.

Try getting rid of those fixed heights on elements, and rather stick with styled widths in percentages, and auto heights on elements. I hope that this is helpful :bowing_man:


#6

Hi @Waldo , and thank you so much for helping me out.
I guess what you’re saying is that I should get rid of xx pixel heights on my sections…I think those are the only ones where I set the heights.
I think I just found one of the reasons for why I set heights. In two of the sections I’ve used BG img in a div block, so if the section heights is set to auto, and even fir I got a second column with lots of content in it, the section gets very narrow and the divblock with the img almost disappear . like this

Following your steps above, didn’t help with the ‘Newsletter’ heading and it’s big frame. So I created a new section just for the Heading, and problem solved. However… the sub heading 'Subscribe to our newsletter! suddenly turned into two lines…as the img under shows, this is how big I can get the heading before it turns into two lines… even if it looks like it got lots of space to go on, also in the divblock. Anyway… I think I can live with that headline in that size… so it’s ok.

Oh… and by the way… the function Ctrl + Z stoped working again too. Any chance you can look into that for me too?

Thanks again for your help!


#7

Just figured it out :slight_smile:
Thanks again for all your help!


#8

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