Hoe <h5> te verenigen met <p>?

Status
Niet open voor verdere reacties.

Aloneal

Gebruiker
Lid geworden
12 nov 2011
Berichten
168
Ik heb een vraag over de indeling van header <h5> en paragraaf <p>.

Ik gebruik nu de volgende opzet:
CSS:

h5 {
font-size: 14px;
font-weight: bold;
margin-top:0px;
margin-bottom:0px;
}

Vervolgens schreef ik de volgende HTML:

Tekst tekst tekst tekst tekst.
<p>
<h5>
Titel 1
</h5>
Tekst tekst tekst tekst tekst.
</p>

Dit mag niet van http://validator.w3.org/check. Je mag blijkbaar geen titels binnen paragrafen stoppen.

Echter: hoe krijg ik dan voor elkaar dat Titel 1 een paragraaf afstand houdt van de bovenliggende tekst, maar geen afstand houdt van de onderliggende tekst? Ik wil de tekst wel in paragrafen zetten vanwege de structuur van mijn site.

Heeft iemand een simpele oplossing?
 
In principe zou je uit moeten gaan van de volgende structuur

HTML:
<p>Tekst tekst tekst tekst tekst.</p>
<h5>Titel 1</h5>
<p>Tekst tekst tekst tekst tekst.</p>

Daarbij heb je dan twee keuzes om de ruimte tussen de bovenste <p> en de <h5> te bepalen:
  • door de margin-bottom van de <p> een aantal px te geven (daarbij zou je dan die bepaalde <p> een eigen class of id moeten meegeven.)
  • door de margin-top van de <h5> een aantal px te geven


Wat ook nog zou kunnen, maar dat is niet echt netjes:
HTML:
<p>Tekst tekst tekst tekst tekst.</p>
<p>&nbsp;</p>
<h5>Titel 1</h5>
<p>Tekst tekst tekst tekst tekst.</p>
 
Laatst bewerkt:
Werken met verschillende p classes / id's?

Dat klinkt tamelijk briljant! En nieuw voor mij. Ik heb erop gezocht en wat gevonden. Ik ga het uitproberen. :)

Bedankt!

Edit: Het werkt!! :shocked: :thumb:

Ik kan weer gaan editen om de boel op orde te krijgen. :D
 
Laatst bewerkt:
Gebruik dit:
Code:
<h5>Titel 1</h5><br />
<br />
<p>Tekst tekst tekst tekst tekst.</p>
De <br /> tag zorgt ervoor dat er een lege regel komt.
 
@EvertW
Er zijn drie dingen mis met jouw suggestie

Je probeert ruimte te maken ónder de <h5> terwijl Aloneal juist ruimte erboven wilde hebben (tussen de <h5> en de vóórgaande <p>.

Het <br>-element moet worden gebruikt ìn een ander element. De W3C specificatie zegt letterlijk:
This element must be used only for line breaks that are actually part of the content:
poems
addresses [Example A] ...


En last but not least: semantisch is het geen juist gebruik van de <br> omdat je hier geen breuk in de content probeert te maken maar je gebruikt het hier om de stijl naar je hand te zetten. Daar zijn stijl-regels voor, oftewel CSS.
 
Ik waardeer het meedenken. Maar inderdaad ben ik juist op aanwijzing van CSS Hunter mijn pagina's aan het ontdoen van oneigenlijk gebruik van <br />. Het gaf problemen in weergave op mijn Android mobiel. Tekst negeerde daar de tweede <br /> en liep gewoon door op die regel. :)
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan