Ich: Margin-left bei H1 und ul soll gleich sein

Beitrag lesen

Hallo,

ich bekomme es nicht hin, das meine Navigation mit einem Rahmen links bündig ist zur Überschrift im Anzeigebereich.

H1 und ul sollen beide einen Außenabstand links von 2.6em haben.

Ich weiß nicht was ich falsch durchdenke,
H1 hat doch eine Spezifität von 0001 und meine ul id eine Spezifität von 0100?

Ich schreibe jetzt schon die Deklarationsblöcke nach der Spezifikation auf (sollte man das nicht immer so machen?)

Kann mir jemand erklären, was ich falsch mache?
Hatte mir die einzelnen Elemente mit einem schwarzen Rahmen drumherum angeguckt, aber klarer wurde es dadurch auch nicht wirklich.

H1 und ul stammen doch beide von body direkt ab?

Hier einmal der Code:

body{
margin:0;
font-family:"Arial Narrow",Arial,sans-serif;
font-size:100.01%;
}

ul#navigation li a{
text-decoration:none;
color: #D6E7B1;
padding: 3px 6px 11.6px 6px;}

ul#navigation li{
text-align:left;
margin-left:2.6em;
border-left:1px solid #D6E7B1;
width: 102px;
height:29px;
float:left;}

ul#navigation{
list-style-type:none;
font-size:0.9em;
letter-spacing:0.1em;
padding:0;
}

h1{
font-size:1.5em;
font-weight:100;
letter-spacing:0.1em;
color:#D6E7B1;
padding:0;
}

</style>
</head>

<body>
<h1>Bla Bla Bla</h1>
<ul id="navigation">
 <li><a href="Startseite.html">Startseite</a></li>
 <li><a href="Verhalten.html">Verhalten</a></li>
 <li><a href="Nahrung.html">Nahrung</a></li>
 <li><a href="Galerie.html">Galerie</a></li>
</ul>
</body>

Gruß, Ich