Comments on: Taking Advantage of What Tables Have to Offer

By: James

James — Tue, 05 May 2009 09:18:01 +0000

I have played around with cols and colgroups before. From what I remember there wasn’t great CSS support. I think I could change the background-color of the columns and that’s about it.

By: Covering the Implication and Basics of CSS Animation - Monday By Noon

Covering the Implication and Basics of CSS Animation - Monday By Noon — Mon, 04 May 2009 12:45:58 +0000

[...] in making sure a design looks equally sophisticated in substandard browsers, and instead opted to leave that last column in my table left aligned instead of making the table a bit easier to read with right [...]

By: Adrian

Adrian — Fri, 01 May 2009 20:06:23 +0000

Thanks for the reminder of column groups, very useful.

By: mysticpixels

mysticpixels — Fri, 24 Apr 2009 12:18:22 +0000

This indeed is a standard – aware way of coding the table. The caption tag is interesting :) I have never used in my projects, even if i have read about it :P Anyways…looking forward to include those in my future works …
Nice read JON ! Keep rocking !

By: Jurij Burkanov

Jurij Burkanov — Thu, 23 Apr 2009 19:41:20 +0000

COLs with IDs are great thing. The only real problem with them, is that you can’t use col’s ID as selector for it’s children. So, if you have a table with INPUTs in TDs, you can’t write in css something like

col#first td input { width: 100px; }

By: Oscar

Oscar — Thu, 23 Apr 2009 14:57:36 +0000

I heard that CSS selectors or pseudo-classes make HTML rendering slower in all browsers.

By: Adam Butterworth

Adam Butterworth — Tue, 21 Apr 2009 14:56:14 +0000

NICE! Unlike some of you older guys :P I am not well versed in table markup at all. Thanks for the post this is totally enlightening and will definitely save me time in the future.

By: Jonathan Christopher

Jonathan Christopher — Tue, 21 Apr 2009 12:07:17 +0000

@Jeff Geerling: colgroup and col are definitely supported by IE6. Unfortunately, however, the enhancements you may add using :first-child and :last-child will not be rendered. It’s not the end of the world though. In my personal practice, I’ll leave IE6 as is (i.e. without right justification on the right-most column) and call it a day. Good browsers get good treats.

@Phil Wheeler: I’m really anxious to see your comment in its entirety but it looks like a piece got cut off – did you include some HTML for reference? If so, WordPress may have eaten it. I tried to recover it but didn’t find much. If you wouldn’t mind including the sample again that would be great, you’ll just need to wrap your tags in < and > respectively.

@Jack McDade: You and me both! They definitely remain useful though.

@Stef Spijkerman: Awesome! Table summaries can be extremely useful for users of assistive technology, and may even help with your SEO a bit if applied correctly in the proper situation.

@trovster: Yes definitely, I should have indicated in my example that ids were used for the sake of brevity. There have definitely been times where I’ve had multiple tables on a page which benefitted from col classes. Awesome tip, thank you!

By: trovster

trovster — Tue, 21 Apr 2009 11:33:47 +0000

I much prefer to use classes in situations like this. That is, classes on the col. This means you can have multiple tables on one page, and not have any conflicts.

This also means you can have multiple classes for each element and style them accordingly, for width, colour combinations.

@JR Tashjian: Beware, you can’t do much styling from the col, to influence the TDs as you might expect. So you may still end up classing the TDs on multiple rows, unfortunately.

By: Darep

Darep — Tue, 21 Apr 2009 11:26:21 +0000

Very nice tip! This will come in handy some day :)