Guten Tag alle miteinander,

ich arbeite derzeit an einer WebSite für eine Hundezüchterin. Die WebSite hat eine Vertikale Navigation mit Buttons (via Liste // ul-li). Insgesamt sind es 9 Buttons, wovon 2 eine "Subnavigation" beim hovern zeigen (sind mit display: none; ausgeblendet). Im FireFox passt auch alles, aber sobald ich im Internet-Explorer über einen Menüpunkte hovere, der eine "Subnavigation" hat, gibt es unter dem Button ein "Abstand" von ca. 2-3 Pixel.

Aber da das nur leserlich schwer zu verstehen ist, habe ich hier 2 Bilder davon.

Im FireFox richtig angezeigt: http://www.e-doggz.de/cssprob_ff.jpg

Im IE falsch angezeigt: http://www.e-doggz.de/cssprob_ie.jpg

Die Navigation (inkl. Subnavigation) ist in ungefähr so aufgebaut:

HTML-Code:

 <ul style="list-style-type: none; padding: 0px; margin: 0px;">
  	<li class="btn_aboutus"><a href="#" class="btn_aboutus_h"></a></li>
        <li class="btn_dogs"><a href="#" class="btn_dogs_h"></a></li>
        <li class="btn_discards"><a href="#" class="btn_discards_h"></a></li>

<!-- Navigation mit Subnav -->
        <li class="btn_news" onmouseover="toggle_navi('show', '1');" onmouseout="toggle_navi('hide', '1');"><a href="#" class="btn_news_h"></a>
    		<ul class="subnav" id="navi_1" style="display: none;">
      				<li><a href="#" class="link_subnav">Quartal I</a></li>
      				<li><a href="#" class="link_subnav">Quartal II</a></li>
                                <li><a href="#" class="link_subnav">Quartal III</a></li>
                                <li><a href="#" class="link_subnav">Quartal IV</a></li>
                                <li><a href="#" class="link_subnav">Alle</a></li>
    		</ul>
	</li>
<!-- Navigation mit Subnav ende -->
                  
</ul>

Der CSS Style zu einem Button sieht folgendermaßen aus:

Code :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

.btn_news {     background-image: url(../Bilder/btn_news_h.jpg);     width: 218px;     height: 47px;     display: block; }   .btn_news_h {     background-image: url(../Bilder/btn_news_uh.jpg);     width: 218px;     height: 47px;     display: block; }   .btn_news_h:hover {     background: none; }

Ich weiß mir einfach nicht mehr zu helfen . Ich habs inzwischen schon mit einem "html condition" versucht und einfach in der style_ie.css ein margin-bottom: -2px; eingetragen. Leider auch ohne Erfolg. Weiß mir einer von euch zu helfen?

Wäre sehr nett.

Falls noch irgendwas benötigt wird, einfach sagen! Werde es schnellstmöglichst nachreichen.

Vielen Dank an Alle

MFG
Tim

Hi,

tritt denn der Fehler in allen IE-Versionen auf?

Da ich mit dem Codeschnipsel den Fehler im IE nicht reproduzieren kann, wäre hier der Link zur Seite hilfreicher.

mfg Maik

Hallo, habe bisher leider nur mit der 7er Version getestet ob es funktioniert.

Der Link zur Seite:

http://www.e-doggz.de/sweetypies/index.php

Vielleicht fällt Dir ja was auf?

Im IE6 tritt der Fehler auch auf

Lösung: Nimm diese Regel im IE-spezifischen Stylesheet (style_ie.css) auf:

Code css:

1	.btn_news, .btn_gb { float:left; }

mfg Maik

Tatsächlich, es funktioniert!

Vielen vielen Dank an Dich!

Hast was gut bei mir

Zitat von sonnySTAR

Tatsächlich, es funktioniert!

Vielen vielen Dank an Dich!

Hast was gut bei mir

Bitte bitte, gern geschehen

Wenn der Frühling auf der Schwäbischen Alb Einzug hält, komm ich das abholen, was ich bei dir gut hab

lg Maik

Bitte bitte, gern geschehen

Wenn der Frühling auf der Schwäbischen Alb Einzug hält, komm ich das abholen, was ich bei dir gut hab

lg Maik

Ein gemütliches Blondes?