Разделение пространства между двумя колоннами ул. ⇐ CSS

[Гость]

У меня есть

Код: Выделить всё

ul

with two columns (of

Код: Выделить всё

li

s). I'm trying to make a visible separation between the two columns, but I can't get it to work. The goal is to make each

Код: Выделить всё

li

have a

Код: Выделить всё

bottom-color

line, but make those lines separated.

This is what I currently have: http://codepen.io/anon/pen/JeluB

HTML

Код: Выделить всё

[list]
[*]asdas
[*]eee
[*]iii
[*]qqqq
[*]yyyy
[*]pppp
[*]p222
[/list]

CSS

Код: Выделить всё

ul{
width:200px;
overflow: hidden;
border: 1px solid red;
padding: 5px;
}

li{
line-height: 1.5em;
float: left;
display: inline;
border-bottom: 1px solid #DDDDDD;
border-right: 2px;
}

#double li  {
width: 45%;
}

Источник: https://stackoverflow.com/questions/266 ... columns-ul