[uf-discuss] hcards into Table's <TR>s -not that straightforward (nor very semantically-sound)!

LucaP lucapost at gmail.com
Fri Sep 28 04:21:48 PDT 2007

I'm dealing with a simple <table> for staff members, where I need to
keep 'family-name' and 'given-name' in two distinct columns, so that
rows can be sorted [jquery] by given-name ...very useful when you
cannot remember your pal's surname! (?)

if I start with
<tr class="vcard">

than I cannot just:
    <td class="family-name">Postpriv</td>
    <td class="given-name">luk</td>
       <td class="tel">443-654439</td>

because f/fn is required by the hcard specification; but at the same
time HTML does not allow
me to wrap an extra <span> around any subset of TDs.

Thus I tried adding a <tbody> for each table row as suggested in
for a similar  issue:

<tbody class="vcard">
    <tr class="fn">
       <td class="family-name">Postpriv</td>
      <td class="given-name">luk</td>
       <td class="tel">443-654439</td>

here the 'fn' wraps around everything, thus Operator & Tails do not
parse the hcard fields correctly.

I was only able to solve this by:
<tr class="vcard">
    <td class="fn">
          <span class="family-name">Amato</span>
          <span class="given-name">Francesca</span>
    <td class="title"> Ass. Amministrativo </td>
    <td class="organization-unit">ETFC</td>

clearly sub-optimal, since I'm duplicating  the given-name in
different columns, then hiding one of them with css.

A plain HTML table with proper THs (ID HEADERS) would be a perfectly
semantic structure for contacts; but fitting hcards into it seems
impossible, without adding way too much extra mark up!
anyhow see the final table at:

note (surprise!): both Operator and Tails do follow the table rows
re-sorting on clicking the table headings

Ciao, Luca P.

More information about the microformats-discuss mailing list