Search code examples
htmlcssxhtmlsemantic-markup

Datalist displayed like a table


How can i achieve this layoutalt text http://img195.imageshack.us/img195/1870/screenshot20091212at151.jpg (now its done with tables) and still have semantic markup, i guess the best suited tag for this would be dl. Every cell must have the height of their row.

EDIT: the left column contains the description and the right the data. So i don't think this is well suited for tables. It would be if i would move the description to the table head, but that would take 2000 px width


Solution

  • If you are concerned about the semantic and think that this is the reason why a definition list is better suited, read this official document about definition list.

    It says:

    Definition lists, created using the DL element, generally consist of a series of term/definition pairs (although definition lists may have other applications)

    and

    Definition lists vary only slightly from other types of lists in that list items consist of two parts: a term and a description.

    That means the term (e.g. Anrede) is described/defined by its description (e.g. Herr ). We can argue here, but Herr is not really a description of Anrede it is more one possible value/word (data) you can use as Anrede. And a definition would be

    A way to address persons, depending on gender, graduation etc.

    Btw for all non german speakers, Anrede means salutation.

    Of course there are exceptions but from an semantic point of view, a table fits better.


    All I want to say is: Don't burden yourself with such things. To get this looking the same with DL tags and CSS is not worth the effort. To use a table for your data is fine, really.