Jump to content

No-Scroll page, responsive to viewers screen and window size

Recommended Posts

Hello community

The design of my website https://www.blaser-betreut.ch is laid out in a way that the best look is achieved if the viewer does not have to scroll. Kind of like a presentation.

So far I did not manage to find a way to achieve my goal of having the site always fill the screen or window. On larger screens, each page is too short and a white space appears at the bottom. On smaller screens the pages will be longer and you will have to scroll down to see the full page.

I found this code:
@media (min-width: 768px) { 
.page-section { 
height: 100vh; 
overflow: hidden; }
}

The problem with this code is, that if I make mi browser window smaller, the elements of the page will move into the header and the size of the pages is not following the size of the browser window at all.

 

Any suggestions? :)

Best regards,
Gino

Link to comment
  • Replies 0
  • Views 122
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

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.