Validatie probleem
Ik ben bezig mijn website helemaal netjes te maken en door een validatie heen te halen. Maar ik kom er bij 1 fout melding niet uit, hopelijk kunnen jullie mij helpen:
De </p> geeft hierbij de volgende melding:
line 100 column 9 - Fout: No p element in scope but a p end tag seen.
[code]-tags geplaatst ipv <?php. Zou je in het vervolg alleen PHP code tussen PHP code tags willen zetten?[/modedit]
Code (php)
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
<div class="grid_8 padtop3">
<h4 class="padtop">Nieuwsberichten</h4>
<p class="padbot35">Hier komen nieuwsberichten.</p>
<p class="padbot36">
<ul class="icons">
<li><a href="https://www.facebook.com/pages/Rigging-Experts/1454326911455393"><img src="http://www.jcsl.nl/rigging/icons/facebook.jpg" alt="" /></a></li>
</ul>
</p>
</div>
<h4 class="padtop">Nieuwsberichten</h4>
<p class="padbot35">Hier komen nieuwsberichten.</p>
<p class="padbot36">
<ul class="icons">
<li><a href="https://www.facebook.com/pages/Rigging-Experts/1454326911455393"><img src="http://www.jcsl.nl/rigging/icons/facebook.jpg" alt="" /></a></li>
</ul>
</p>
</div>
De </p> geeft hierbij de volgende melding:
line 100 column 9 - Fout: No p element in scope but a p end tag seen.
[code]-tags geplaatst ipv <?php. Zou je in het vervolg alleen PHP code tussen PHP code tags willen zetten?[/modedit]
Gewijzigd op 15/01/2014 18:46:47 door Wouter J
<ul> is een block level element. Een <p>-element mag geen block level elementen bevatten.
Gewijzigd op 15/01/2014 18:55:13 door Willem vp
ok dus hoe zou ik dit dan moeten oplossen? Want die p is onderdeel van het skeletonlayout.
is div dan een goede oplossing?
is div dan een goede oplossing?
Gewijzigd op 15/01/2014 18:58:20 door J C
Als het geen optie is om de <ul> buiten de <p> te plaatsen, zou je nog kunnen proberen om de <ul>-tags te verwijderen en de <li>-tags om te zetten in een <span> of zo. Maar misschien heeft iemand een betere oplossing.
>> zou je nog kunnen proberen om de <ul>-tags te verwijderen en de <li>-tags om te zetten in een <span> of zo. Maar misschien heeft iemand een betere oplossing.
Dat is nog fouter dan de huidige situatie.
JC, je hebt 2 oplossingen. 1tje is semantisch veel beter. Een p staat voor paragraph (alinea). Een lijst die onderdeel van een alinea is ziet er ongeveer zo uit: item een; twee; drie; en vier. Dat wil jij hier niet. Jij hebt een lijst die er zo uitziet:
Zoals je ziet staat deze tussen 2 alinea's in: tussen 2 <p> elementen dus. Niet in een alinea. Dus:
Als we dan naar jouw huidige lay-out kijken lijkt die <p class="padbot36"> helemaal niet te kloppen. Dat is namelijk geen alinea, maar een blokje met een willekeurige content (lijst, plaatje, tekst, etc.). Een <div> (een block element zonder betekenis) zou dus het beste weer staan in dit geval.
En als je dat niet wilt aanpassen. Gewoon zo laten en je geen zorgen maken over die validator. Browsers supporten het en wat maakt het dan uit dat het tegen de regels is? Het is een beetje miepen over de te kleine details. Maar goed, semantiek (wat ik hierboven uitlegde) is wel goed om op orde te hebben.
Dat is nog fouter dan de huidige situatie.
JC, je hebt 2 oplossingen. 1tje is semantisch veel beter. Een p staat voor paragraph (alinea). Een lijst die onderdeel van een alinea is ziet er ongeveer zo uit: item een; twee; drie; en vier. Dat wil jij hier niet. Jij hebt een lijst die er zo uitziet:
- item een
- twee
- drie
- en vier
Zoals je ziet staat deze tussen 2 alinea's in: tussen 2 <p> elementen dus. Niet in een alinea. Dus:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<p>Een alinea</p>
<ul>
<li>item een</li>
<li>twee</li>
<li>drie</li>
<li>en vier</li>
</ul>
<ul>
<li>item een</li>
<li>twee</li>
<li>drie</li>
<li>en vier</li>
</ul>
Als we dan naar jouw huidige lay-out kijken lijkt die <p class="padbot36"> helemaal niet te kloppen. Dat is namelijk geen alinea, maar een blokje met een willekeurige content (lijst, plaatje, tekst, etc.). Een <div> (een block element zonder betekenis) zou dus het beste weer staan in dit geval.
En als je dat niet wilt aanpassen. Gewoon zo laten en je geen zorgen maken over die validator. Browsers supporten het en wat maakt het dan uit dat het tegen de regels is? Het is een beetje miepen over de te kleine details. Maar goed, semantiek (wat ik hierboven uitlegde) is wel goed om op orde te hebben.
Nou wat ik heel graag wil leren is zo'n website bouwen die ook op een mobiel goed te zien is, vandaar deze structuur. Dus waarom in het begin al zulke fouten laten zitten
Ik zou dan zoiets krijgen denk ik:
Ik zou dan zoiets krijgen denk ik:
Code (php)
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
<div class="grid_8 padtop3">
<h4 class="padtop">Nieuwsberichten</h4>
<div class="padbot35">Hier komen nieuwsberichten.</div>
<div class="padbot36">
<ul class="icons">
<li><a href="https://www.facebook.com/pages/Rigging-Experts/1454326911455393"><img src="http://www.jcsl.nl/rigging/icons/facebook.jpg" alt="" /></a></li>
</ul>
</div>
</div>
<h4 class="padtop">Nieuwsberichten</h4>
<div class="padbot35">Hier komen nieuwsberichten.</div>
<div class="padbot36">
<ul class="icons">
<li><a href="https://www.facebook.com/pages/Rigging-Experts/1454326911455393"><img src="http://www.jcsl.nl/rigging/icons/facebook.jpg" alt="" /></a></li>
</ul>
</div>
</div>
>> Dus waarom in het begin al zulke fouten laten zitten
Naja, je moet niet altijd de drang hebben om alles valid te krijgen. Heeft trouwens niks te maken met mobiel enzo. W3C is het team dat de regels heeft bedacht en browsers implementeren deze regels. Hoe browsers er mee omgaan is wat uitmaakt, of W3C het dan misschien niet leuk vind dat je een spatie daar hebt een een & teken daar is allemaal een beetje teveel gemiep.
>> Ik zou dan zoiets krijgen denk ik
Dat ligt aan wat je doel is en of je HTML5 gebruikt.
Zomaar iets dat me bijv. al opvalt: <div class="padbot35">Hier komen nieuwsberichten.</div>
Nieuwsberichten zijn een opsomming van berichten, een lijst dus, geen div.
Naja, je moet niet altijd de drang hebben om alles valid te krijgen. Heeft trouwens niks te maken met mobiel enzo. W3C is het team dat de regels heeft bedacht en browsers implementeren deze regels. Hoe browsers er mee omgaan is wat uitmaakt, of W3C het dan misschien niet leuk vind dat je een spatie daar hebt een een & teken daar is allemaal een beetje teveel gemiep.
>> Ik zou dan zoiets krijgen denk ik
Dat ligt aan wat je doel is en of je HTML5 gebruikt.
Zomaar iets dat me bijv. al opvalt: <div class="padbot35">Hier komen nieuwsberichten.</div>
Nieuwsberichten zijn een opsomming van berichten, een lijst dus, geen div.
Helemaal gelijk op beide punten.
Het laatste moet inderdaad later nog een lijst worden, maar ben er nog niet uit hoe ik dat ga voorgeven of indelen, dus heb er even tijdelijk een blok van gemaakt.
Het laatste moet inderdaad later nog een lijst worden, maar ben er nog niet uit hoe ik dat ga voorgeven of indelen, dus heb er even tijdelijk een blok van gemaakt.
Wouter J op 15/01/2014 19:18:44:
W3C is het team dat de regels heeft bedacht en browsers implementeren deze regels. Hoe browsers er mee omgaan is wat uitmaakt, of W3C het dan misschien niet leuk vind dat je een spatie daar hebt een een & teken daar is allemaal een beetje teveel gemiep.
Dat is absoluut geen gemiep. Wat jij beschrijft is juist de bron van alle ellende.
Weg met alle quirks- en compatibility modes. Wat je nu ziet, is dat de ene browser zich niet aan de standaard houdt, waar vervolgens een webdesigner weer gebruik van maakt, zodat andere browsers kunstgrepen uit moeten halen om de betreffende website te kunnen tonen. Maar omdat elke browser weer een andere rendering engine heeft, zal het resultaat voor elke browser weer net iets anders zijn. En doordat iedere browser zal proberen een site die zich niet aan de standaards houdt zo goed mogelijk te tonen, worden ontwerpers ook niet geprikkeld goed werk af te leveren, waardoor het probleem alleen maar groter wordt.
Op dit moment is het gewoon onmogelijk om een site te maken die op alle browsers goed werkt, en dat schrijf ik voor het grootste deel toe aan de vergevingsgezindheid van de browsers betreffende de bagger die ze aangeleverd krijgen. Hoe was dat spreekwoord ook weer van die zachte heelmeesters die stinkende wonden maken? Het huidige wereldwijde web is een grote stinkende wond van kansloze HTML-rommel.
Het probleem is dat wanneer je nu een stricte compliancy zou afdwingen, zo'n 98% van de web"designers" gaat blaten omdat hun site niet meer werkt. Toch denk ik dat het de enige manier is om van de stank af te komen.
Gewijzigd op 15/01/2014 19:55:13 door Willem vp
Ik verwacht niet dat ik daar met die ene website die ik per jaar bouw nou echt verschil in ga maken.




