CSS Tree menue falsch eingerückt, bleibt nicht aufgeklappt

  • ersteinmal Hallo,



    hab ein css-tree-menue zusammengestellt, welches auch einigermaßen funktioniert.
    das problem ist, wenn man auf haupt1 klickt öffnet sich alles so weit so gut. warum ist aber ab haupt2 diese seite eingerückt? hab in der css datei gesucht und bin irgendiwe nicht aiúf einen grünen zweig gekommen (evtl betriebsblindheit)
    was muss geändert werden damit alles ordentlich untereinander (je nach unterkategorie) steht?
    ist es möglich dies zu ändern, dass es offen bleibt (bei den angeklickten link) (kommt man glaube ich nicht um javascript herum) und wenn man einen anderen hauptpunkt anklickt, dass es den offenen schließt?
    das dritte ist, wie bekomme ich den inhalt (website) des angeklickten ziellinkes in ein bestimmten div-container einer css-aufgebauten website?
    ---------------------------------------------------------------------------------------------------------------------------------------------
    inhalt css-datei



    *, html { font-family: Verdana, Arial, Helvetica, sans-serif; }
    body, form, ul, li, p, h1, h2, h3, h4, h5
    {
    margin: 0;
    padding: 0;
    }
    body { background-color: #606061; color: #ffffff; margin: 0; }
    img { border: none; }
    p
    {
    font-size: 1em;
    margin: 0 0 1em 0;
    }



    html { font-size: 100%; /* IE hack */ }
    body { font-size: 0.75em; /* Sets base font size to 16px */ }
    table { font-size: 100%; /* IE hack */ }
    input, select, textarea, th, td { font-size: 1em; }

    /* CSS Tree menu styles */
    ol.tree
    {
    padding: 0 0 0 30px;
    width: 300px;
    }
    li
    {
    position: relative;
    margin-left: -15px;
    list-style: none;
    }
    li.file
    {
    margin-left: -1px !important;
    }
    li.file a
    {
    background: url(toggle-small-expand.png) 0 0 no-repeat;
    color: #fff;
    padding-left: 20px;
    text-decoration: none;
    display: block;
    }
    li.file a { background: url(toggle-small-expand.png) 0 0 no-repeat; }
    li input
    {
    position: absolute;
    left: 0;
    margin-left: 0;
    opacity: 0;
    z-index: 2;
    cursor: pointer;
    height: 1em;
    width: 1em;
    top: 0;
    }
    li input + ol
    {
    background: url(toggle-small-expand.png) 40px 0 no-repeat;
    margin: -0.938em 0 0 -44px; /* 15px */
    height: 1em;
    }
    li input + ol > li { display: none; margin-left: -14px !important; padding-left: 1px; }
    li label
    {
    /*background: url(folder-horizontal.png) 15px 1px no-repeat;*/
    cursor: pointer;
    display: block;
    padding-left: 10px;
    }



    li input:checked + ol
    {
    background: url(toggle-small.png) 40px 5px no-repeat;
    margin: -1.25em 0 0 -44px; /* 20px */
    padding: 1.563em 0 0 80px;
    height: auto;
    }
    li input:checked + ol > li { display: block; margin: 0 0 0.125em; /* 2px */}
    li input:checked + ol > li:last-child { margin: 0 0 0.063em; /* 1px */ }



    ---------------------------------------------------------------------------------------------------------------------------------------------
    inhalt html-datei:



    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">



    <html lang="en-GB">



    <head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <meta name="robots" content="all">


    <!--[if gte IE 9 ]><link rel="stylesheet" type="text/css" href="_styles.css" media="screen"><![endif]-->
    <!--[if !IE]>--><link rel="stylesheet" type="text/css" href="_styles2.css" media="screen"><!--<![endif]-->





    </head>
    <body>

    <ol class="tree">
    <li>
    <label for="haup1">haup1</label> <input type="checkbox" id="haupt1" />
    <ol>
    <li>
    <label for="unter1">unter1</label> <input type="checkbox" id="unter1" />
    <ol>
    <li class="file"><a href="">unter1_1</a></li>
    <li class="file"><a href="">unter1_2</a></li>
    </ol>
    </li>
    <li>
    <label for="unter2">unter2</label> <input type="checkbox" id="unter2" />
    <ol>
    <li class="file"><a href="">unter2_1</a></li>
    <li class="file"><a href="">unter2_2</a></li>
    <li class="file"><a href="">unter2_3</a></li>
    <li class="file"><a href="">unter2_4</a></li>
    <li class="file"><a href="">unter2_5</a></li>
    <li class="file"><a href="">unter2_6</a></li>
    <li>
    <label for="unter2_1">unter2_1</label> <input type="checkbox" id="unter2_1" />
    <ol>
    <li class="file"><a href="">unter2_1_1</a></li>
    <li class="file"><a href="">unter2_1_2</a></li>
    </ol>
    </li>
    <li class="file"><a href="">unter2_7</a></li>
    <li class="file"><a href="">unter2_7</a></li>
    </ol>
    </li>
    <li class="file"><a href="">haupt2</a></li>
    <li class="file"><a href="">haupt3</a></li>
    <li class="file"><a href="">haupt4</a></li>
    <li class="file"><a href="">haupt5</a></li>
    </ol>


    </li>
    </ol>

    </body>
    </html>





    danke für die hilfe?

  • Auszug aus den Forenregeln:

    Zitat

    Inhalt von Beiträgen:
    [FONT=Verdana, Arial, Helvetica, sans-serif]Forum-Hilfe behält sich das Recht vor, jederzeit Beiträge zu löschen, zu verschieben oder zu überarbeiten, die nicht den Forumsregeln entsprechen. Dies geschieht ohne vorherige Information des Verfassers. Die User ist alleine für die von ihnen publizierten Inhalte (Texte; Bilder oder andere Veröffentlichungen) verantwortlich und bestätigt auch damit, das er keine Copyrightgeschütze Werke und Texte hier im Forum veröffentlicht.
    Verboten oder auch unerwünscht sind folgende Inhalte:
    [/FONT]

    • [FONT=Verdana, Arial, Helvetica, sans-serif]extrem politisch oder religiös orientierte Postings [/FONT]
    • [FONT=Verdana, Arial, Helvetica, sans-serif]strafbare, pornographische, jugendgefährdende, beleidigende oder ehrverletzende Inhalte[/FONT]
    • [FONT=Verdana, Arial, Helvetica, sans-serif]Warez oder fremde copyrightgeschütze Werke [/FONT]
    • [FONT=Verdana, Arial, Helvetica, sans-serif]E-Mail Adressen [/FONT]
    • [FONT=Verdana, Arial, Helvetica, sans-serif]Songtexte [/FONT]
    • [FONT=Verdana, Arial, Helvetica, sans-serif]persönliche Angaben wie Telefonnummern, Adressen usw (diese bitte per PN austauschen) [/FONT]
    • [FONT=Verdana, Arial, Helvetica, sans-serif]oder anderweitig inakzeptabel Postings, die hier nicht erfasst wurden, aber gegen geltendes Recht, die guten Sitten, allgemeines Moralempfinden oder eben gegen die Forenregeln verstossen.[/FONT]
    • [FONT=Verdana, Arial, Helvetica, sans-serif]Crosspostings - die gleiche Frage in mehreren anderen Foren gleichzeitig stellen[/FONT]