Suoraan sisältöön

CSS-ongelmaa

Kaveri tuossa eilettäin kyseli apua ongelmaansa. Kyseessä on ihan yksinkertainen asia, joka toimii normaalissa tilanteessa, elikkäs elementin sijoittaminen vasempaan laitaan niin, että teksti kiertäisi sitä.

Normaalitilanteessa tämä tapahtuu helposti asettamalla kyseiselle kelluvalle elementille tyyleihin float: left; ja mielellään myös jokin leveys. Tässä tapauksessa haluamme laittaa tekstin sekaan listoja ja muitakin sisennettyjä elementtejä. Näiden elementtien marginaali katoaa kelluvan elementin alle, jolloinkas ei ihan oikealta näytä.

Asia on oikeasti hankala selittää, joten tein pienen esimerkkisivun, jolta voi käydä katsomassa, mitä tarkoitan. Jos joku keksii järkevän ratkaisun, saa ilmoitella. Mitään havaintoa ei ole toimivuudesta ”vanhempien” selaimien kanssa. Eikä ole nyt niin väliksikään.

Over and out.

2 Replies to “CSS-ongelmaa”

  1. Nollataan tarvittaessa paddingit ja marginit.
    Käytetään text-indenttiä niiden sijaan.

    ul {
    padding-left: 0px;
    margin-left: 0px;
    text-indent : 20px;
    }

    li {
    margin-left: 0px;
    list-style-position: inside;
    }

    dd {
    /* old value: margin-left: 20px;*/
    margin-left: 0px;
    text-indent : 20px;
    }

  2. Tomi

    Kiitoksia. Sinun ratkaisusi ratkaisee asian, mikäli tekstiä on vain yksi rivi per elementti. Tuo text-indent ei sisennä kuin sen ensimmäisen.

Kommentit on suljettu.