vertical line html

<style>
.vl {
  border-left: 6px solid green;
  height: 500px;
}
</style>

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

To make a vertical line, use the border-left or border-right property. The height property is used to set the height of the border (vertical line) element. The position property is used to set the position of a vertical line. Example 1: It creates a vertical line using border-left, height, and position property.

Example:
.vl {
  border-left: 6px solid green;
  height: 500px;
  position: absolute;
  left: 50%;
  margin-left: -3px;
  top: 0;
}

Supported Browsers:

• Google Chrome
• Internet Explorer
• Firefox
• Opera
• Safari
• Microsoft Edge

Put a <div> around the markup where you want the line to appear to next, and use CSS to style it:

.verticalLine {
  border-left: thick solid #ff0000;
}

<div class="verticalLine">
  some other content
</div>