Easiest Vertical Line Ever

Look Demo

Easily create a vertical line using the line block. This plugin uses css editor and works with all template families.

Screen+Shot+2019-08-12+at+2.19.50+PM.jpg

How To Install

On any page, add a line block next to the content you’d like the vertical line to show. Save the page when done.

Next, go to the Custom CSS Editor. Copy and paste the code below into the Custom CSS Editor box.

// Easiest Vertical Line //

.sqs-block-horizontalrule hr {
  height: 135px;
  width: 5px;
}

// Hide Vertical Line On Mobile //

@media only screen and (max-width: 640px){
.sqs-block-horizontalrule hr {
display: none !important;
}
}

Customize

Adjust the height and width values to your liking. The color of the line can be changed in the Site Styles settings.

Note: It’s common to hide vertical lines on mobile devices, so included is a code to hide the line block on the mobile version of your site.

Notes

No notes.

Moov Labs