[Erledigt] Display:Block verursacht ungewollten Zeilenabstand (IE)

MCee Donald · 14.01.2010, 10:37

Hallo,
es ist mir fast peinlich für dieses Problem ein eigenes Thema zu erstellen, aber ich habe nirgends eine Lösung gefunden.

Ich erstelle ein Menü, indem die Manü-Punkte untereinander dargestellt werden:

Code:

<div id="sidebar">
  <div class="MyMenu">
    <ul>
      <li><a href="">Mein Profil</a></li>
      <li><a href="">Gästebuch</a></li>
      <li><a href="">Bilder</a></li>
    </ul>
  </div>
</div>

Dazu folgender CSS-Inhalt:

Code:

#sidebar div.MyMenu {
                margin-top: 20px;
                text-align: center;
}

#sidebar div.MyMenu li {
                list-style: none;
                padding: 0;
                margin: 0;
}

#sidebar div.MyMenu a{
        display: block;
        margin:0;
        padding: 5px 10px 5px 10px;
        font-size:14px;
        color:#0067A6;
}

#sidebar div.MyMenu a:hover{
        background-color:#e1e1e1;
}

Das Problem ist, dass der IE zwischen den li-Tags eine große Lücke lässt.
Das liegt auf jeden Fall am "Display:Block", denn wenn ich dies weg lasse wird es in den Browsern gleich angezeigt.
Habe auch "margin:0;" gesetzt -> keine Änderung.
Ich möchte dass der ganze li-Bereich einen hover-effekt erzeugt und anklickbar ist - nicht nur der Text innerhalb des <a>-Tags.
Und das ist soviel ich weiß nur mit Display:Block möglich.

Hoffe ihr könnt mir helfen, den Zeilenabstand zu bereinigen =)

Gruß

MCee Donald · 14.01.2010, 12:26

ich hab mir selbst geholfen..
habe einfach folgendes Menü genutzt und angepasst:
Verticales-Menü

ich verstehe zwar immernoch nicht wo mein Fehler war, aber wenigstens ist es jetzt wie ich es wollte....

Gruß

Dark Guardian · 14.01.2010, 18:34

Das div um die ul ist relativ überflüssig da ul selbst ein Block-Element ist.

ie abstand bei li - Google-Suche

Da finden sich viele viele "Lösungsvorschläge" wovon manche bei manchen funktionieren und manche bei anderen nicht....

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Leerzeichen verursacht ungewollten Zeilenumbruch	Steppe	PHP Tipps 2009	6	15.12.2009 01:24

14.01.2010, 10:37
MCee Donald Benutzer Registriert seit: 28.10.2008 Beiträge: 94	[Erledigt] Display:Block verursacht ungewollten Zeilenabstand (IE) Hallo, es ist mir fast peinlich für dieses Problem ein eigenes Thema zu erstellen, aber ich habe nirgends eine Lösung gefunden. Ich erstelle ein Menü, indem die Manü-Punkte untereinander dargestellt werden: Code: <div id="sidebar"> <div class="MyMenu"> <ul> <li><a href="">Mein Profil</a></li> <li><a href="">Gästebuch</a></li> <li><a href="">Bilder</a></li> </ul> </div> </div> Dazu folgender CSS-Inhalt: Code: #sidebar div.MyMenu { margin-top: 20px; text-align: center; } #sidebar div.MyMenu li { list-style: none; padding: 0; margin: 0; } #sidebar div.MyMenu a{ display: block; margin:0; padding: 5px 10px 5px 10px; font-size:14px; color:#0067A6; } #sidebar div.MyMenu a:hover{ background-color:#e1e1e1; } Das Problem ist, dass der IE zwischen den li-Tags eine große Lücke lässt. Das liegt auf jeden Fall am "Display:Block", denn wenn ich dies weg lasse wird es in den Browsern gleich angezeigt. Habe auch "margin:0;" gesetzt -> keine Änderung. Ich möchte dass der ganze li-Bereich einen hover-effekt erzeugt und anklickbar ist - nicht nur der Text innerhalb des <a>-Tags. Und das ist soviel ich weiß nur mit Display:Block möglich. Hoffe ihr könnt mir helfen, den Zeilenabstand zu bereinigen =) Gruß


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

14.01.2010, 12:26
MCee Donald Benutzer Registriert seit: 28.10.2008 Beiträge: 94	ich hab mir selbst geholfen.. habe einfach folgendes Menü genutzt und angepasst: Verticales-Menü ich verstehe zwar immernoch nicht wo mein Fehler war, aber wenigstens ist es jetzt wie ich es wollte.... Gruß

14.01.2010, 18:34
Dark Guardian Erfahrener Benutzer Registriert seit: 10.10.2009 Beiträge: 2.630 PHP-Kenntnisse: Fortgeschritten	Das div um die ul ist relativ überflüssig da ul selbst ein Block-Element ist. ie abstand bei li - Google-Suche Da finden sich viele viele "Lösungsvorschläge" wovon manche bei manchen funktionieren und manche bei anderen nicht.... __________________ "Alles im Universum funktioniert, wenn du nur weißt wie du es anwenden musst".