LI -> weiter runter

[Nina]

hallo,

habe meine navigation als liste eingebaut:
#navi li {
 list-style-type:none;
 border-left:11px solid black;
 border-bottom:2px solid black;
 width:183px;
 height:20px;
 margin-bottom:5px;
}

<ul id="navi">
<li>a</li>
<li class="runter">b</li>
<li>c</li>
<li>d</li>
<li>e</li>
<li class="runter">f</li>
</ul>

nun wäre es toll, wenn die mit runter versehenen felder zum darüberliegenden z.b. einen abstand von 20px hätten.
habe es mit padding und margin bereits versucht -> vergeblich :(
wie bringe ich die listenelemente weiter runter und noch dazu ohne, dass der border(bottom) sich streckt.

soll ja so aussehen:
| a

| b
| c
| d
| e

| f

und _nicht_ so:
| a
|
| b
| c
| d
| e
|
| f

habt Ihr einen guten ratschlag, wie sich das nach unten versetzen lässt?

danke und schönen sonntag noch