Showcase a Scrollable Website page

How can you best feature your website design portfolio? Here’s a great option using CSS. Create a scrollable page by just using an image block and a couple of CSS Codes. Please watch the video below to view the guided tutorial.

Kindly watch the video below for a walkthrough.

Please refer to the codes below as mentioned in the video above.

Paste the code below toDesign > Custom CSS

#PASTE-BLOCK-ID {
  height: 500px;
  max-width: 80%;
  margin:auto;
  width: 100%;
  overflow-y:scroll;
  overflow-x:hidden;
  filter: drop-shadow(2px 22px 40px rgba(0,0,0,.3));
  
  @media screen and (max-width:767px) {
   height:200px;
  }
}

To customize the scrollbar

::-webkit-scrollbar {
    width: 3px; /* Scrollbar Thickness */
    height:15px;
}
::-webkit-scrollbar-thumb {
    background: #22514A; 
}
::-webkit-scrollbar-track {
    background: white; /* Background Color */
}

---

Want to add stylish and unexpected features in your Squarespace site?

Easily Create this stylish vertical tab feature.