CSS en lists
7 maart 2008 - 08:15   
geplaatst door: peterdh
beginnersvraagje: heb een stijl aangemaakt in CSS, maar zodra ik binnen die stijl een list (bullets) aanmaak "verandert" de interlinie, of eigenlijk is die veel te veel.
heb me gek gezocht, maar kan die bedenken hoe ik de interlinie in een list aan kan passen?
(dus tussen de regel en de eerste bullet, oftewel de <P>
ik krijg de interlinie wel kleiner, maar dan gaan de bullets ook mee en dat is nu weer niet de bedoeling.

voorbeeld

Fit & Firm Massage, Groet, Peter
CSS en lists
7 maart 2008 - 09:36    reactie #1
geplaatst door: Kapotlood
De bullets zitten natuurlijk vast aan de regel waar ze voor staan :)

Even voor de sure, een html list:

<ul>
  <li>Unordered list</li>
  <li>Unordered list </li>
  <li>Unordered list </li>
  <li>Unordered list </li>
</ul>

Zo ziet hij er normaal gesproken uit (als je 'n Unordered list gebruikt).
De bullets worden automatisch geplaast bij elke "li", dus die horen bij
die betreffende regel... als je de interlinie wil verkleinen gaan die inderdaad
mee. Wat je wel kunt doen is die bullets vervangen voor een eigen plaatje,
ander icoontje of gewoon helemaal weghalen.

Interlinie in css kun je overigens aanpassen met deze tag:
line-height: 1em;

CSS en lists
7 maart 2008 - 10:01    reactie #2
geplaatst door: peterdh
ik begrijp dat ze er aan vast zitten, maar ik zou graag de ruimte tussen het hoofditem en de eerste bullet verkleinen, zonder ook de ruimte tussen de bullets onderling te verkleinen
Fit & Firm Massage, Groet, Peter
CSS en lists
7 maart 2008 - 10:06    reactie #3
geplaatst door: mvdg
De 'ul' is het onzichtbare ding waar de 'li's met zijn allen in zitten.
Als je de marge of padding van de ul aanpast zal die omringende ruime dus kleiner worden.
Speel eens met de waarden in het volgende css statement:

ul { margin: 2px; padding; 4px; border: 1px solid red; }

Als je een beetje uitprobeert met die 2 en die 4 zie je gauw genoeg wat het effect is denk ik.
Het 'border' gedeelte heb ik er ingezet zodat je makkelijker kunt testen.
De ruimte BINNEN de border bepaal je met 'padding', de ruimte BUITEN de border met de 'margin'.
Mitch Design : websites en interactieve toepassingen : http://www.mitchdesign.nl
CSS en lists
7 maart 2008 - 23:04    reactie #4
geplaatst door: peterdh
Dank Mitch, dat was de oplossing die ik zocht, wat kan het leven toch simpel zijn
(als je weet waar je moet zoeken)
Fit & Firm Massage, Groet, Peter