如何在文本列表之间放置垂直线？

Question

这是我想要实现的目标：http://i.imgur.com/sGYfvOv.png

我无法正确调整所有内容并寻求帮助。我会喜欢它的中心。这是我目前的代码：

HTML：

<p class="aboutus">
<b>About Us</b><br>
<br>   
NECI Overview<br>
Our History<br>
Accreditation<br>
Why choose us?<br>
Campus Tour<br>
Affliations<br>
Awards<br>
Community <br>
News<br>
</p>

<hr width="1" size="190" align="left">

CSS：

.aboutus{

font-family: 'Lato', sans-serif;
font-size: 14px;
float: left;
}

Answer 1

另一个FIDDLE。

CSS

.myinfo {
    width: 150px;
    height: 200px;
    float: left;
    border-left: 2px solid black;
    padding-left: 10px;
}
.myinfo:last-child {
    border-right: 2px solid black;
}