Fix side scrolling on all devices

The .page-wrapper is a common class used to wrap the entire content of a page. Sometimes, you might encounter elements that overflow the boundaries of your page, causing horizontal scrollbars or layout shifts. To address this, you can use the overflow: clip; property to prevent any content from overflowing the boundaries of the .page-wrapper:

 <style> 

.page-wrapper {
overflow: clip;
}

</style>

Similar Code Snippets

Calculate sizes in CSS

CSS's calc() function allows you to perform calculations to determine CSS property values. It's incredibly useful for responsive design, such as when you need to adjust sizes dynamically. For example, if you want a div to be 100% of the viewport width minus a certain margin, you can use calc():

View Snippet

Pull content from another page

404 page need a collection list? Webflow told you it can't happen? We've got you covered. Use this code to pull in the nav or entire page design from another page into your 404.

View Snippet

Fade non-hovered links

A fun animation where hovering over links will fade out all the items except the hovered item.

View Snippet

View All Snippets