CSS-i küsimus listi kohta

  • potpot† 14 a

    on siis list kujul
    <ul>
    <li>Esimene peateema
    <ul>
    <li>alamteem
    </ul>
    </li>
    .....

    Et mitu peateemat ja mitu alamteemat.

    lõpptulemus peaks jääma kujule.

    -----------------------------------------------------
    ' P1 ' P2 ' P3 ' P4 '
    -----------------------------------------------------
    ' P1-a1 ' P2-a1 ' P3-a1 ' P4-a1 '
    -----------------------------------------------------

    Kokkuvõttes nagu drop-down menu ilma drop-downita, et on koguaeg nähtav.

    Probleem mille ees seisan on järgmine.

    Oleks vaja, et

    Menüü rida oleks ainult nii lai kui on tekst P1, P2 jne....

    Terve püstine tulp oleks sama lai kui peateema

    nt:

    PEATEEMA ÜKS
    -alamteema

    -alamteema
    mis on pikem
    tehakse cut

    -jne..

    Loodan, et sai piisavalt selge.

    Siiani olen proovinud

    max-width, ja relative koosseisu, aga lühikesed väljad kisub ikkagi max-widthi järgi.

    02. august 2010 - 15:31:28 · Otselink

  • abi† 14 a

    Proovi järgnevat:

    <style type="text/css">
    ul {
    list-style: none;
    margin: 0;
    padding: 0;
    }
    ul span {
    display: block;
    }
    ul li {
    float: left;
    margin-left: 20px;
    position: relative;
    background-color: #33FFFF;
    }
    ul li ul {
    position: absolute;
    width: 100%;
    }
    ul li li {
    float: none;
    margin-left: 0;
    background-color: #009900;
    }
    </style>

    <ul>
    <li>
    <span>Peateema 1</span>
    <ul>
    <li>Alamteema 1-1</li>
    <li>Alamteema 1-2</li>
    <li>Alamteema 1-3</li>
    <li>Alamteema 1-4</li>
    <li>Alamteema 1-5</li>
    </ul>
    </li>
    <li>
    <span>Peateema 2</span>
    <ul>
    <li>Alamteema 2-1</li>
    <li>Alamteema 2-2</li>
    <li>Alamteema 2-3</li>
    <li>Alamteema 2-4</li>
    <li>Alamteema 2-5</li>
    </ul>
    </li>
    </ul>

    02. august 2010 - 18:58:07 · Otselink

  • marko† 14 a

    position absolute ja pikkus 100 prossa? mida sa sellega saavutada üritad? ning milleks seda positionit seal üldse vaja on?

    <style>
    ul { list-style: none; margin: 0; padding: 0; }
    ul li { float: left; background-color: #33FFFF; }
    ul li li { float: none; background-color: #009900; }
    </style>

    ja htmlis SPAN tagid pole vajalikud.

    04. august 2010 - 12:10:40 · Otselink

  • potpot† 14 a

    Abi - sinu antud näide töötab nagu vaja aint, et span tag-id on üleliigsed antud hetkel ja ilma nendeta ei tööta. Tegemist WP-ga

    marko - sinu antud näites jääb kogu kast nii suureks kui on alamteema pikkus, mitte nagu vaja oleks olnud, et kasti laius on sama mis peateema laius.

    Tänud.

    04. august 2010 - 13:53:34 · Otselink

  • kerttuperttu† 14 a

    võid wp's ju menüüd ise genereerida või siis selle pages_list vms ümber modida.

    04. august 2010 - 16:37:03 · Otselink

  • marko† 14 a

    listile käib holder ümber potpot.

    09. august 2010 - 16:08:49 · Otselink