4 ms·
It's not really a case of TABLE-elements versus DIV-element. It's a case of semantic markup or not. If something is semantically a table (i.e. data which is not
by olavk 18y ago
It's not really a case of TABLE-elements versus DIV-element. It's a case of semantic markup or not. If something is semantically a table (i.e. data which is not just liniear but structured along two axes) then use table-markup.
A good rule of thumb is to decide if a structure is semantically a table, is to consider if it would make sense with headers (TH-elements) in the first row and the first column.
If something is not semantically a table - e.g. you have a linear list of items - then you don't use either DIV's or TABLE's, but rather the appropriate markup which is UL og LI elements. DIVs are semantically neutral, so you shouldn't really need them often. Mostly they are used precisely to overcome limitations in the CSS implementations in current browsers. DIVs are useful though when there is some structure which dosn't have an appropriate element defined in HTML, eg. there is no "footnote" or "header"-elements in HTML, so you use DIV to mark these elements.
With proper semantic markup you can use CSS to control if your list of items should be displayed as a bulleted list (display:list-item) or as cells in a grid (display:table-cell) or whatever - without changing the markup. This is a pretty nice seperation. Again, it doesn't give you any new layout power but it allows you to structure your code in a more maintainable way and produce better markup.
Regarding screenreaders the issue has nothing to do with degrading. The issue is that a screenreader which understands table semantics may allow the reader to navigate in two dimensions, explain the headers in both dimensions associated with a cell and so on. But if table markup is used both for 2D data sets and for all kinds of layout purposes like positioning an image or whatever, then this feature becomes useless or at least annoyning.