Setting the height on a border in CSS

[dunglan]

I have a left/right border on a list to create a separation effect.Ex: \[code\]Link1\[/code\] | \[code\]Link2\[/code\] | \[code\]...\[/code\]I want the lines on the border to be a bit shorter than the total height of the object -- maybe 50% of the total height and centered vertically. However, they are 100% of height. How can I set a height on a border and center it vertically?Thanks!\[code\]<ul class="nav pull-right" style="line-height:30px;"> <li class="dropdown pull-right" style="line-height:20px;border-left: 1px solid #e3e3e3;border-right: 1px solid #e3e3e3;"> <a href="http://stackoverflow.com/questions/15488736/#" class="dropdown-toggle" data-toggle="dropdown"> {% if notice_unseen_count %} <span class="badge badge-warning" style="line-height:15px;">{{ notice_unseen_count }}</span>{% else %}<span class="badge" style="line-height:15px;">0</span>{% endif %} </a> <ul class="dropdown-menu"> <li><a href="http://stackoverflow.com/questions/15488736/{% url messages_inbox %}">Inbox</a></li> <li class="divider"></li> <li><a href="http://stackoverflow.com/questions/15488736/{% url invitations %}">Invitations</a></li> <li class="divider"></li> <li><a href="http://stackoverflow.com/questions/15488736/{% url notification_notices %}">All Notifications</a></li> </ul> </li>\[/code\]