Jump to content

Whitespace after code block only in Firefox, not Chrome

Go to solution Solved by Timacious,

Recommended Posts

In the new layout system, code blocks seem to cause unwanted white space after the block.

Scroll to the bottom of my page:

https://www.bettermonroe.org/

It contains a long code block.

It looks fine on Chrome.  But on Firefox and Safari, there is a large amount of whitespace between the end of the page and the footer.

The only custom CSS I have is:
p { line-height: 1.5em; }
.form-wrapper input[type=submit]:hover { background: #0FE1FD; }

I don't have a subscription that enables custom CSS on each page.

Does anyone know how this can be fixed?

Thank you!

 

 

Link to comment

I added some more CSS and now it is broken in Chrome too - there's a lot of whitespace below the code block.  The CSS I added (for the whole site) is:


a:link, a:visited {
  color: #0F86FD;
  text-decoration: none;
}

a:hover, a:active {
  background-color: white;
}

Link to comment
  • Solution

I solved the problem by making a new page using the old layout engine.  Thank you to the expert who posted the tip on how to add a section with the old style template (I didn't realize it was even possible).  When you go to select a template, scroll to the bottom and read the fine print.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.