[css] text-indent volgende regel - Softwareontwikkeling

donderdag 5 oktober 2006 13:20

Acties:

Verwijderd

Topicstarter

Ik heb de eigenschappen voor een LI gedefinieerd in CSS. Het kan zijn dat de tekst die tussen <LI> en </LI> staat niet op 1 regel past. In dat geval wil ik dat de tweede regel iets verder ingespringt dan de eerste. Ik ben bekend met text-indent, maar deze beinvloedt uitsluitend het begin van de eerste regel.

Is dit mogelijk?

donderdag 5 oktober 2006 13:24

Acties:

Verwijderd

CSS2 (volgens mij) ondersteunt de pseudo class :first-line.. dus als je de hele <li> indent, en vervolgens de first-line negatief indent heb je het gewenste effect..
hier meer informatie

[ Voor 32% gewijzigd door Verwijderd op 05-10-2006 13:24 ]

donderdag 5 oktober 2006 13:26

Acties:

MTWZZ

One life, live it!

Zoiets:

code:

<html>
    <head>
        <title>Test Highlighting</title>
        <style type="text/css" media="screen">
            body {
                width: 300px;
            }
            ul {
                width:100%;
            }
            li {
                padding-left:20px;
            }
            li:first-letter {
                margin-left:-20px;
            }
        </style>
    </head>

    <body>
        <ul>
            <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent ultrices. Sed libero metus, sagittis consequat, pulvinar id, congue non, magna. Integer rutrum euismod odio. In a massa ut nibh tristique rutrum. Nunc risus erat, pharetra et, congue sit amet, aliquam et, nulla. Quisque at tellus.</li>
            <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent ultrices. Sed libero metus, sagittis consequat, pulvinar id, congue non, magna. Integer rutrum euismod odio. In a massa ut nibh tristique rutrum. Nunc risus erat, pharetra et, congue sit amet, aliquam et, nulla. Quisque at tellus.</li>
            <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent ultrices. Sed libero metus, sagittis consequat, pulvinar id, congue non, magna. Integer rutrum euismod odio. In a massa ut nibh tristique rutrum. Nunc risus erat, pharetra et, congue sit amet, aliquam et, nulla. Quisque at tellus.</li>
            <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent ultrices. Sed libero metus, sagittis consequat, pulvinar id, congue non, magna. Integer rutrum euismod odio. In a massa ut nibh tristique rutrum. Nunc risus erat, pharetra et, congue sit amet, aliquam et, nulla. Quisque at tellus.</li>
            <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent ultrices. Sed libero metus, sagittis consequat, pulvinar id, congue non, magna. Integer rutrum euismod odio. In a massa ut nibh tristique rutrum. Nunc risus erat, pharetra et, congue sit amet, aliquam et, nulla. Quisque at tellus.</li>
        </ul>
    </body>
</html>

edit:

Even wat veranderd, zo blijft ook de list-style behouden.

@Kage: first-line werkt niet altijd goed omdat (zoals in het voorbeeld) de tekst niet altijd meerdere regels is.

[ Voor 4% gewijzigd door MTWZZ op 05-10-2006 13:29 ]

Nu met Land Rover Series 3 en Defender 90

donderdag 5 oktober 2006 13:28

Acties:

Janoz

Moderator Devschuur®

!litemod

Als text-indent enkel de eerste regel beinvloed en je wilt de regel een stukje verder naar links hebben dan zou je deze natuurlijk ook een negatieve waarde kunnen geven.

Ken Thompson's famous line from V6 UNIX is equaly applicable to this post:
'You are not expected to understand this'