Note that there are some explanatory texts on larger screens.

plurals
  1. POUnderstanding <table> use semantics
    text
    copied!<p>I recently had a discussion with another developer who was using <code>&lt;table&gt;</code> for data that was not tabular.</p> <pre><code>&lt;table&gt;&lt;tr&gt;&lt;td&gt; Server: &lt;/td&gt;&lt;td&gt; Development &lt;/td&gt;&lt;/tr&gt;&lt;/table&gt; </code></pre> <p>I pointed out that <a href="http://www.w3.org/TR/html5-author/the-table-element.html#the-table-element" rel="nofollow">tabular data has more than one dimension, and use of tables for styling/presentation is discouraged</a>. He responded that just because the table was one row does not mean that the data is non-tabular.</p> <p>It seems to me that if "tabular data" has more than one dimension it would require at least two rows and two columns. However, he pointed out that <code>&lt;table&gt;&lt;tr&gt;&lt;td&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;</code> (as well as <code>&lt;table&gt;&lt;/table&gt;</code>) <a href="http://validator.w3.org/" rel="nofollow">both validate</a>, and that if he is using <code>&lt;table&gt;</code> incorrectly, the W3C is unclear and they did a poor job with their validator.</p> <p>I think that <code>&lt;table&gt;</code> is supposed to be used to represent <em>data</em> that is tabular whether or not the resulting structure is tabular as their can be caveats. In the above example, there will only ever be one server, but you can potentially have zero or more rows of multi-column data that is perhaps filtered on a date range.</p> <p>My question is who is right here? If I am misunderstanding the spec, then <em>how</em> am I misunderstanding? If you have <em>data</em> that is tabular but not enough filtered data to print out multiple rows (i.e. if it is filtered on a small date range) is it incorrect to print only the column headers? Should you print a "no results found" full colspan row as well? If data in <code>&lt;table&gt;</code> must be multi-dimensional, why does a single-column and/or single-row table validate?</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload