View Full Version : Tables in HTML5?

06-05-2012, 02:38 PM
Have been trying to construct a football league table which has 3 columns. Would really appreciate any of the forum experts criticisms and/or advice.

The webpage itself can be viewed here! (http://www.freewebs.com/diarco/columns.html)

Thanks all

06-05-2012, 05:16 PM
looks like you figured it out?

html5 tables are just like previous html versions.

06-05-2012, 08:17 PM
Thanks for the reply SeattleMicah

06-06-2012, 01:29 AM
Well, actually, the table is semantically incorrect. But it has nothing to do with HTML 4 or 5, it’s semantically incorrect in both versions. There is an extensive article (http://accessiblehtml.sourceforge.net/accessible_tables.html) (from 2002 but still valid today) on how to create a proper and accessible irregular table (such as yours is an irregular table).

For one, nesting tables is bad practice. You should rather use column groups (<colgroup>) to group columns and for the table “title”, or rather caption, you should use the <caption> element. Also, the border and align attributes are long deprecated and shouldn’t be used. That’s what CSS is there for.

06-06-2012, 02:10 AM
sorry frump didnt look at your code! ya don't nest tables!!!! haha

06-09-2012, 10:11 AM
Shall start learning all about (<colgroup>) to group columns. Thanks VIPStephen

06-11-2012, 05:31 PM
Have been looking around and came up with my latest effort. Would someone have a look at the CSS for me please.

Also, i can't figure out how to make a new css rule which would make each individual team align to the left and add a little padding.

You can view my latest effort HERE (http://www.freewebs.com/diarco/tables_practice.html)

06-11-2012, 05:41 PM
hey good looking table.

You can place a class on all of the <td> with the names.

<td class="teamName">Birmingham</td>

Then add some css for that class to the align the text for the names left, and add some padding.

.teamName {text-align:left; padding: 20px 20px 20px 20px;}