Wieso haben Listenelemente mit Inline-block verdammte Abstände?! 
Hier mein Problem:
http://jsfiddle.net/b8Cnq/5/
Und Nein, ich möchte nicht mit Float arbeiten!! 
Code:
HTML
<body>
<header>
<nav>
<ul>
<li>
<a href="home/" class="active">Home</a>
<ul>
<li><a href="home/info/" >Info</a></li>
<li><a href="ueber-uns/" >Über Uns</a></li>
</ul>
</li>
<li>
<a href="home/">Home</a>
<ul>
<li><a href="home/info/" >Info</a></li>
<li><a href="ueber-uns/" >Über Uns</a></li>
</ul>
</li>
<li class="sonder">Ohne a-Tag</li>
</ul>
</nav>
</header>
</body>CSS
*{padding: 0;margin: 0;}body{background-color: #999;}
header>nav li{
list-style-type: none;
display: inline-block;
padding: 10px;
background-color: #FFF;
}
/* Erste Ebene Padding umgehen */
header>nav>ul>li{
padding: 0px;
background-color: #FFF;
}
header>nav>ul>li>a{
display: inline-block;
padding: 10px;
}
/* Verschachtelung verstecken */
header>nav ul ul{
display: none;
position: absolute;
}
header>nav ul ul>li{
display: block;
}
/* Verschachtelung zeigen */
header>nav li:hover{
background-color: #444;
transition: background-color 1s;
}
header>nav li:hover ul{
display: block;
}
.sonder{
padding: 10px;
}
Versuch mal mit letter-spacing zu spielen.