Ich bekomme die Lücke zwischen Elementen nicht weg

[MaWe]

Hallo zusammen.

Ich habe folgendes Problem:
Die Navigationsleiste soll horizontal angeordnet sein, jeder Link in einem eigenen Kasten. Das bekomme ich auch soweit gut hin, nur hätte ich gerne, dass zwischen den Kästen keine Lücke ist.
So sieht es mit Lücke aus:


Ich habe das margin doch schon auf 0 gesetzt.
Wenn ich mit padding spiele, wird nur der Abstand von Text zum Rahmen kleiner, ich hätte die Kästchen aber gerne direkt aneinander.

#navigation ul li{
    display: inline;
    border: 2px solid;
    text-decoration: none;
    font-size: 180%;
    padding: 4px;
    margin: 0px;
    background-color: #CE6700;
}
#navigation a {
    text-decoration: none;
    padding: 4px;
    margin: 0px;
}
#navigation a:hover {
    background-color: #E18D38;
    color: black;
    padding: 4px;
    margin: 0px;
}

    <div id="navigation">
        <ul>
  <li><a href="link1.php">Link1</a></li>
  <li><a href="link2.php">Link2</a></li>
  <li><a href="link3.php">Link3</a></li>
  <li><a href="link4.php">Link4</a></li>
  <li><a href="link5.php">Link5</a></li>
        </ul>
    </div>

Wer weiß Rat ?

Danke im Voraus
Martin