Jump to content

Vertical Lines between Sections

Recommended Posts

Site URL: https://www.betterpupsdogtraining.com/obedience

Hi Squarespace Community! 

I need a vertical line between sections.  I added, this CSS but it was overlapping on the mobile view.  Thank you for your help.


<div class="vl"></div>


// this is a vertical divider-line
.vl {
border-left: 2px solid #000000; // defines the width, style and color of the line (change the hex code [#303030] to match your site).
  height: 850px; // defines the length of the line.
  position: absolute;
  left: 50%; //move the line to the middle (50% of the page width)
  margin-left: -1px; //half the width of border witdth to ensure the line is precicely centered on the page.
  top: 0;

Link to comment
  • Replies 3
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

Do you have a visual or a mock-up of what you're aiming to achieve?

Work With Me 🖥️💻📱

Please remember to tag me so that I get a notification and respond to your help requests.

If my answers have helped you, please drop a like and mark my answer as best to help other users find solutions quickly.

You can also thank me or make requests by buying me a coffee . (Caffeine fuels me to take more requests)

For Squarespace Tips & Tricks, visit @squareskills (Youtube 📺 Tutorials)

For Premium and FREE plugins, visit Squareskills (Plugin Store) 🧩

Some links may be affiliate/referral links.

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.