Tabellen binnen CSS

Ik moet een flink aantal pagina's maken waarbinnen ook tabellen met reisinfo komen te staan. Echte tabellen dus. Aangezien de rest van de site xhtml / css is zit ik nu ineens met twee problemen. 1] moet ik de tabellen als tabel laten staan of is er een nette maniet om ook die tabellen in CSS te vangen 2] Als ik echte tabellen ga gebruiken, hoe geef ik die dan vorm, want binnen de CSS die ik nu heb gedragen ze zich wat onmogelijk.

Ik heb nog geen fatsoenlijk voorbeeldje, eerst de CSS die ik her-en-der geleend heb opschonen…

Tja, wat moet je zeggen als je nog geen voorbeeld hebt. Tuurlijk kun je echte tabellen gebruiken, zoals je aan gegeven hebt voor orderen van data, waar tabellen voor bedoeld zijn. Maar ik ben met je eens dat het goed stylen nogal behoorlijk lastig in combi met div elementen en x-browser. Maar kom eens met je eerste opzet, dan kunnen we er eens naar kijken.

Roel

Kijk eens hier: [url]http://www.alistapart.com/articles/tableruler/[/url] en hier: [url]http://www.alistapart.com/articles/zebratables/[/url]

Een ‘bewijs’ dat dit soort dingen wel in tabellen kunnen/horen, met wat uitleg voor de weergave er van.

Sja. Zit ik Zeldman uit te spitten en kom ik met Google op 10.000 sites die verklaren dat je geen tabellen meer moet gebruiken, staat het gewoon bij alistapart...

Ik kom vandaag nog wel met een voorbeeldje…

Je kunt in plaats van tables ook span gebruiken en deze exact naar wens maken in css. Ik heb bijvoorbeeld een rooster gemaakt met behulp van span.

Maar simmering, dan gebruik je niet eens tabellen waar je ze eens een keer 'goed en vooral correct' mag gebruiken! Je kan gewoon simpele tabellen gebruiken voor die data!

Probleem van vormgeven van de tabel-tag is dat "border-collapse" niet ondersteunt wordt. De beste methode om tabellen op te maken met CSS is:

  • Gebruik een XHTML transitional of HTML4 transitional doctype
  • maak gebruik van de properties border=“0”, cellspacing=“0” en cellpadding=“0” om alles klaar te zetten, anders gaat het niet goed met de padding en margin e.d.
  • maak goed egbruik van de <th>, <thead>, <colgroup> tags om functioneel onderscheid te maken in je data in de tabel en zet dan de CSS op die tags (zie http://www.htmlhelp.org/reference/html40/olist.html voor een lijst van alle table elementen)

Als je data in een tabelvorm gepresenteerd moet worden, gebruik dan ook een tabel, want daar zijn die dingen voor; lopen klooien met span’s en div’s om een tabelvorm te reproduceren in CSS is net zo fout als het gebruik van tabellen voor layout waar alle CSS-fundamentalisten tegen te hoop lopen; voor de goede orde: Zeldman en consorten zijn voor het gebruik van tabellen, niet tegen, alleen wel om de juiste reden.

Ik ga vandaag een heleboel leren vrees ik...

Dank. Jullie zien wel weer als ik me uit de thead en colgroup tags heb bevrijd!