Hoi Niekee,
De andere fouten in de html-validator zijn nog niet opgelost. Dat scheelt altijd als je pagina niet doet wat je wilt.
Maar voor het gat in het content-gedeelte was dit het niet.
Dit wordt niet gevuld omdat nergens staat dat het gevuld moet worden.
D.w.z. er moet ergens een "clear" ingevoegd worden om de witte achtergrond te laten doorlopen tot het benedeneind van de gefloate linkerkolom.
Verder kan de pagina-structuur en de css ook een stuk beter, dan gaan alle opschrift-vakjes mooi in de pas lopen met de rest van de opmaak. Dat is nog best een klusje.
Maar kijk:
Opmerkingen:
- De css heb ik voor het gemak in de <head> gezet, dat moet nog een apart stylesheet worden.
- Als je javascript direct in een pagina opneemt, moet je die voorzien van een "cdata" omhulsel (d.w.z. character data: lettertekens die door browsers, validators en zoekrobots niet opgevat moeten worden als html-codes).
- De hele #wrapper kan gemist worden, je kan de pagina centreren via de body-css.
- <center> is afgekeurde html.
- Ook de <div id="content"> kan gemist worden.
- De {height: 100%;} her en der kan gemist worden.
- Behalve als het geen kwaad kan: nooit hoogtes van <div>'s opgeven. Anders kan er tekst uit de <div>'s lopen bij vergroting van de letters door de bezoeker.
- Lettergrootes niet opgeven in absolute px-maten, maar in de relatieve em-maten, anders kunnen bezoekers met Internet Explorer de lettergrootte niet groter maken als voor hen de letters te klein zijn om te lezen (in IE kan je wel op de hele pagina tegelijk inzoomen, maar dan moet je voortdurend van links naar rechts scrollen om de regels te kunnen lezen).
- Plaatjes kan je beter in je tekenprogramma verkleinen, dan ze door de browser op maat te laten schalen. Dat ziet er een stuk beter uit.
- Extra <br />'retjes om verticale afstanden tussen regels te zetten zijn niet zo goed: kan beter met css gedaan worden.
Verder is het belangrijk voor de toegankelijkheid van webpagina's (en ook voor zoekmachines), dat er een duidelijke paginastructuur is met headers, paragrafen, enz.
De paginastructuur kan je opvragen via de html-validator (bij de opties aanvinken "Show outline", vervolgens de knop "revalideren" aanklikken, en dan helemaal onderaan de validator-pagina gaan kijken).
Met jouw testpagina komt er het volgende te staan:
Het witte regeltje betekent: er is geen document-structuur, want er zijn geen h1, h2, enz. tags te vinden (de kopjes zijn gemaakt met <span>'s in gewone <p>'s).
Met h1, h2 enz. tags in de html wordt niet alleen de html overzichtelijker; deze dingen zijn dan ook veel makkelijker in css vorm te geven.
Met de aangebrachte headers is er in mijn testpagina wel een structuur te zien:
Tot slot aanbevolen: je html- en css-theorie eens wat opfrissen, vooral over margins, paddings en "vloten & klieren" (floats & clears).
Succes!
CSShunter
[/edit]
