Hmm als ik een h1 tag onderlijn, dan krijg ik die onderlijning over de ganse breedte van dat blok.

Hoe doen jullie dat ? Als je de tekst binnen een h1 wilt onderlijnen ?

Doormiddel van css.

Code:

h1 {
border-bottom:1px dotted #000;
}

Dit zou moeten werken.

Origineel gepost door Jesse Vlasveld

Doormiddel van css.

Code:

h1 {
border-bottom:1px dotted #000;
}

Dit zou moeten werken.

Neen dan krijg je over gans de breedte van dat blok van die h1 een onderlijning, niet enkel onder de tekst.

Voor zover bij mij bekend is bestaat een h1 tag enkel uit text.
Tenzij je er natuurlijk een block element van maakt, en een andere width meegeeft.

edit. Je hebt gelijk, ik heb het nog even bekeken. De lijn komt inderdaad onder het gehele blok.

Ik zal kijken of er enige oplossing is.

http://webcel.nl/html/tables/block.html

staat hier toch beschreven als blok element.

Oke, ik heb het. Het enige wat je toe hoeft te voegen is hetvolgende:

Code:

h1 {
border-bottom:1px dotted #000;
display:inline;
}

Ah mega.

Kan je er een woordje uitleg bij geven wat die 'display' precies doet ? Je ziet die vaak bij ul en li's ook om die horizontaal te krijgen. Maar ik snap de functionaliteit er niet van.

Mijn excuses. Een uitleg zal helaas niet gaan. Ik weet enkel het effect wat het geeft wanneer bepaalde displays worden gebruikt.

Het enige wat ik kan vertellen zal je niet erg veel aan hebben:

display:block = een block element zorgt voor een regelafbreking aan het einde van dit element
display:inline = zorgt ervoor dat er geen regelafbreking komt.

Ik weet dat er een betere uitleg bij hoort. Misschien dat w3schools je beter kan helpen.

www.google.nl en je hebt het zo gevonden

maargoed, here it goes:
je weet wat een <div> is en doet?
je weet wat een <span> is en doet?

<span> = inline
<div> = block
<span style="display: block;"> = <div>
<div style="display: inline;"> = <span>

zo zou je het kunnen zien.
wat block betekent:
ter breedte van de beschikbare ruimte en een eigen regel (clear: both)

wat inline betekent:
in-line ofwel binnen de regel. zal enkel de ruimte gebruiken die benodigd is en heeft geen eigen regel (clear: none)

that's about it

als je een h1 wilt onderlijnen moet je wel even clear: both erbij zetten als je hem inline maakt anders zul je zien dat de tekst naast de titel komt te staan.

Merci voor de uitgebreide uitleg.

Super uitleg, helemaal duidelijk nu.

een div != clear:both hoor.

Let trouwens wel op dat IE6 geen dotted border van 1px weergeeft. Die maakt daar een dashed border van 1px van. Als dit een probleem is kan je beter een background instellen dat een lijn nabootst.

kijk eens wat:
<div>a</div><div>b</div><div>c</div>
doet...

er zullen vast enkele minor differences zijn maar het doet vrijwel hetzelfde.