I need to be able to separate the two columns by a vertical line:
<div class="container">
<div class="row">
<div class="col-md-6">
<p>some text here </p>
</div>
<div class="col-md-6">
<p>some more text here</p>
</div>
</div>
</div>
To add a vertical line using the shape tool, go to Insert | Shapes and select the Line tool. Place the cursor where you want the line to start, and drag to where you want the other end of the line to be. Holding the Shift key while you drag will ensure that the line is straight.
Use three equal signs(===) and enter a button to add a double line. Use three underscores(___) and enter a key to form a divider with a medium thickness. Press three number signs (###) and enter a key to make a thicker line with a border. And to round it up, use three tildes (~~~) and enter to make a wavy divider line.
To make a vertical line, use border-left or border-right property. The height property is used to set the height of border (vertical line) element. Position property is used to set the position of vertical line. Example 1: It creates a vertical line using border-left, height and position property.
use css border-right:1px solid black
to achieve this. demo here: http://jsfiddle.net/swm53ran/35/
html:
<div class="container">
<div class="row">
<div class="col-md-6 border-right">
<p>some text here </p>
</div>
<div class="col-md-6">
<p>some more text here</p>
</div>
</div>
</div>
css
.border-right {
border-right: 1px solid black;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With