How to Add a Double Border to a Text Block in Squarespace
This blog post walks you through how to add a double border to a text block in Squarespace.
Watch the video or follow along in the step-by-step tutorial.
Scroll down for the code.
Add a Double Border to a Text Block in Squarespace
Go to pages > Website tools > Custom CSS
Copy and paste the code below this video (scroll down) right here
For the next step, you're going to need the Squarespace Chrome ID finder installed in your Chrome browser
Select the ID finder from your browser and locate the block ID associated with the text block that you want to apply this code to and select it—it will automatically copy to the clipboard
Highlight the code where it says “BLOCK ID GOES HERE” and paste it
If you want to add a double border to another text block, add a comma directly after the first block ID
Select the block ID associated with the second text block that you want to apply this code to and right after that comma, paste this block ID (do this as many times as you want for as many text blocks as you want)
Customize the code by adding the hex code of your own brand color or by changing the border width
So easy. Right?
Code Snippet to Add a Double Border to a Text Block in Squarespace
/* Add a double border to a text block */
BLOCK-ID-GOES-HERE {
border-style:double;
border-color: #3e4259;
border-width:3px;
}
Was this helpful?
Is this just the design element you’ve been looking for? Are you going to try it? I have it on my ‘Services’ page. Where will you put your? Share your thoughts in the comments 👇
This page contains affiliate links
My Insta
@jenxwebdesign
Like this post?
