How to create a vertical line in Weebly
Saturday August 24, 2013 | Comments
Step 1. Create your columns
Drag the "Multiple Columns" badge down to the page, and the click on "3" to create 3 columns.
Step 2. Add the Vertical Line HTML code
Drag the "Custom HTML" badge to the middle column.
Insert the following HTML code into the "Custom HTML" badge:
<div class="vertical-line" style="height: 500px;"></div>
Note: Change this number to make your vertical line longer or shorter: style="height: 500px;"
Step 3. Add the Vertical Line CSS code
Click on Design at the top, and then click on Edit HTML/CSS on the right of the page.
Click on main-style.css in the column on the left.
Scroll all the way to the bottom of the CSS Style Sheet and add the following code:
When you've added the code, click save
You're done! Publish your site
Details of Project
Level of difficulty: Beginner
Time to complete: 5 Minutes
How To Install Any Font Into Your Weebly Site
Updated on June 20, 2016
How To Create A Sidebar That Will Appear On Every Standard Weebly Page
Updated on June 11, 2016
How To Create An "<h1>" Tag In Your Weebly Site
Updated on July 9, 2016
Weebly Tricks on Facebook
Weebly Tricks on Google+