Verachtelte Listen unschön dargestellt

    Hallo,

    ich habe ein Blog auf wordpress.com mit dem Thema Contempt von Vault9. In einem Beitrag möchte ich verschachtelte Listen nutzen:

    Code
    <ol>
<li>Ebene 1</li>
<ul>
<li>Ebene 2</li>
<li>Ebene 2</li>
</ul>
<li>Ebene 1</li>
</ol>

    Dargestellt wird allerdings:

    1. Ebene 1[INDENT] 1.* Ebene 2
    [/INDENT][INDENT] 2.* Ebene 2
    [/INDENT]2. Ebene 1


    Sehr unschön finde ich die Zahlen vor den Punkten in der 2. Ebene.

    Im CSS habe ich folgendes gefunden:

    Code
    ol li, #sidebar ul ol li {
list-style-image:none;
list-style-position:outside;
list-style-type:decimal;
}

    Wenn ich mit FireBug die letzte Zeile ausschalte, passt alles.
    Folgender Versuch bringt allerdings keine Veränderung:

    Code
    <li style="list-style-type:none;">Ebene 2</li>

    Das CSS kann man bei wordpress.com leider irgendwie nur gegen Geld ändern... :(

    • Gerade eben
    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

    Hi,

    die Listen wurden falsch geschachtelt.
    So ist es richtig:

    HTML
    <ol>
<li>Ebene 1
<ul>
<li>Ebene 2</li>
<li>Ebene 2</li>
</ul>
</li>
<li>Ebene 1</li>
</ol>

    Das schließende li-Element kommt erst nach der eingefügten ul. ;-)

    Zitat

    Das CSS kann man bei wordpress.com leider irgendwie nur gegen Geld ändern... :sad:

    Oder du lernst es.

    Gruß
    koslowski

    Hi,

    die browserübergreifende Darstellung der voreingestellten Listenzeichen ist kaum in den Griff zu bekommen.

    Beim FF ist z.B. die Default-Einstellung von list-style-position outside und beim IE ist es inside.

    Das Sicherste ist, die Listenzeichen für alle li-Elemente auf list-style-type:none; zu setzen (also ziemlich oben in der style.css). und Hintergrundgrafiken als Listenzeichen einzusetzen.

    Die Lösung mit HG-Grafiken als Listenzeichen ist browserübergreifend i.d.R. völlig unproblematisch. :wink:

    Gruß
    koslowski

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden