Darstellungsproblem IE7 mit a display: block

[Mario Sch.]

Hallo,

ich bin gerade dabei eine Navigationsleiste zu erstellen.
Diese erstelle ich in einem div, darin ein <ul> Element und in diesem für jeden Eintrag in der Leiste ein <li>.
Ich habe für die einzelnen Einträge einen Hintergrund, 155x25px groß.
Diese Größe ist auch den li-Tags zugewiesen.
In den li-Elementen habe ich nun die Links zu den einzelnen Seiten Platziert. Damit sie nicht am oberen Rand von dem Hintergrund kleben, habe ich dem <a>-Tag das CSS-Attribut display: block zugewiesen und padding auf 6px.
Das Problem, das im IE 7 dabei entsteht: Nach dem li-Element entsteht ein etwa 2px großer freiraum.
Das möchte ich aber irgendwie wieder weg bekommen. Wenn ich das display: block weglasse, entsteht er nicht, aber dann kann ich auch kein padding mehr benutzen.
Eine andere alternative ist, dem a-Element noch die width: 155px-(2mal padding) und die height 25px-(2mal padding) zuzuweisen, aber diese Alternative erscheint mir nicht sehr elegant.
(FF und Opera haben keine Darstellungsprobleme damit)

Hier einmal der Quelltext:

<div id="hauptnavigation">
    <ul>
      <li><a href="test.php">tet</a></li>
      <li><a href="test.php">test2</a></li>
    </ul>
  </div>

in der CSS-Datei:

* {
  padding: 0;
  margin: 0;
}
#navibar {
  width: 155px;
  background-color: #ff0000; /* nur um die ca 2px besser zu sehen die weg sollen  */
  color: #2E3192;
}
#navibar ul, #navibar ul li {
  list-style: none;
}
#navibar a {
  text-decoration: none;
  display: block;
  color: #2E3192;
  width: 143px; /* hier wie gesagt die 155px minus 12px padding */
  height: 13px;
}
#navibar ul li {
  font-weight: bold;
  background: transparent url(img/navibarentry.png) no-repeat;
  width: 155px;
  height: 25px;
}
#navibar ul li a {
  padding: 6px;
}

Bin für alle Lösungsvorschläge dankbar :)

Grüße
Mario

[Struppi]

Hier einmal der Quelltext:

<div id="hauptnavigation">
    <ul>
      <li><a href="test.php">tet</a></li>
      <li><a href="test.php">test2</a></li>
    </ul>
  </div>

Mal abgesehen davon, dass die id falsch ist, welchne DOCTYPE verwendest du?

Struppi.

[Mario Sch.]

Hi,

Mal abgesehen davon, dass die id falsch ist,

lol, die sind im normalem Dokument natürlich gleich, hatte da irgendwas falsch kopiert :)

welchne DOCTYPE verwendest du?

HTML 4.01 Transitional

Grüße

[Struppi]

welchne DOCTYPE verwendest du?

HTML 4.01 Transitional

Das spielt keine Rolle, Quirks- oder Standardmode?

Struppi.

[Mario Sch.]

Das spielt keine Rolle, Quirks- oder Standardmode?

Wo steht das? :[

Mario

[Struppi]

Das spielt keine Rolle, Quirks- oder Standardmode?

Wo steht das? :[

In selfhtml

Struppi.

[Mario Sch.]

Hi,

In selfhtml

Danke -> Standardsmode (hatte mir FF auch angezeigt, war mir aber unsicher)

Grüße

[Struppi]

Danke -> Standardsmode (hatte mir FF auch angezeigt, war mir aber unsicher)

Um jetzt alles auszuschliessen, der DOCTYPE steht in der ertsen Zeile und du verwendest keine xml Deklaration?

Struppi.

[Mario Sch.]

Hi,

Um jetzt alles auszuschliessen, der DOCTYPE steht in der ertsen Zeile und du verwendest keine xml Deklaration?

Na klar! Sag bloß, bei dir funktioniert es?!?

Grüße
Mario

[Struppi]

Na klar! Sag bloß, bei dir funktioniert es?!?

Ja, deshalb auch meine Fragen, mittlerweile habe ich auch festgestellt, dass der Code immer funktionert, sowohl im IE 6 als auch 7.

Struppi.

[Mario Sch.]

Hi,

Ja, deshalb auch meine Fragen, mittlerweile habe ich auch festgestellt, dass der Code immer funktionert, sowohl im IE 6 als auch 7.

Ok ich hab mal eine Testseite hochgeladen: http://rapidshare.de/files/38187105/Desktop.rar.html
Im Moment will echt nix mehr wie ich es will.. jetzt hab ich auch noch Probleme mit height.. aber das in einem anderem Thema demnächst vielleicht :D

Aber du hast auch meine 2 Kommentare in dem CSS Abschnitt gelöscht? Ich sagte ja, damit geht es, aber ich fragte ja warum nicht ohne..

Grüße