Beste SDers,

weer ben ik er met een vraag rond de <ul> lijst.
Ik vroeg me af (heb al gekeken op google, ook al geprobeert, maar vriend met IE7 zag totaal niets :/ ) hoe je bij een li, ipv bolletje, een custom figuurtje kan zetten zoals : http://www.mediatemple.net/support/our_promise.htm

Graag snel antwoord aub.
Alvast bedankt,
Frederik VDBerge

Doen ze het daar niet toevallig simpel :P? een tab met een plaatje en een spatie ?

Nou, ik heb wel hulp nodig... dus even serieus :p

Origineel gepost door Glenn van Laerhoven

Doen ze het daar niet toevallig simpel :P? een tab met een plaatje en een spatie ?

list-style-image: url(li.gif);
;)

I was just kidding heb even voor je gezocht als je iets anders zou willen.
Hier staat iets uitgelegt:
http://www.mijnhomepage.nl/csscursus/les8.php

*verwijdert*
Kijk hier bij laatste nieuws (voor diegene die pijltjes zien)
ze staan veel teveel naar links, en als ik ze mbv padding naar rechts verschuif, dan schuift lijntje onder de li's ook naar rechts (en wil ik niet, wil dus dat lijn ook mooi onder de arrows.gif komen).
Help

een alternatieve oplossing is de list stijl volledig te verwijderen en dan als background image een plaatje te zetten. dan moet je wel even klooien met de padding aan de linker kant maar als je een enkel background plaatje neer zet dan kun je het ook doen.

dit is wel een laatste redmiddel. ik zou het eerst met de list-style properties aan de gang gaan alsvoor je hier aan gaat beginnen.

De beste manier om dit te doen is de lijst een achtergrond te geven die zich niet herhaald, op deze manier kan je de positie steeds perfect aanpassen met background-position.

Bv zo dus:

li {
background: url('images/afbeelding.gif') no-repeat;
background-position: 5px 10px;
}

Om de link weg van de afbeelding te zetten gebruik je dan simpelweg padding-left: XXpx.

EDIT: Wat de persoon vóór mij zei dus, hij was wat sneller dan mij ;)

Ok bedankt, ik ga het meteen even proberen.

BTW : weet iemand hoe ik apparte CSS fle maak op een MAC ? (zonder dreamweaver of frontpage te hebben)

bedankt

simpel. pak een text editor en sla het op als .css daarna roep je hem aan vanuit je html pagina. net zoals je dat op de PC ook doet ;)