Tema: 2 dudas sobre las tablas de datos accesibles
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 22/11/2010, 09:59
Timak
 
Fecha de Ingreso: marzo-2009
Mensajes: 18
Antigüedad: 15 años, 9 meses
Puntos: 0
2 dudas sobre las tablas de datos accesibles
Hola.

Mi primera duda es si se puede manipular el caption de manera que quede alineado con los th y justo por encima de los td, así:

<caption><th><th><th>
<td><td><td><td>

¿Me entienden? He probado con la propiedad caption-side:left, efectivamente pone el caption a la izquierda, pero las td no se ponen debajo del caption sino de los th.

Os enseño un ejemplo sencillo:
Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Documento sin título</title>
  6. <style>
  7.     table {width:50%; border:0.1em solid #aaa;}
  8.     table caption {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:0.7em; caption-side:left; width:20em; border-top:0.1em solid #aaa; border-left:0.1em solid #aaa; border-bottom:0.1em solid #aaa;}
  9.     table th {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:0.7em; font-weight:bold; text-align:center; border-left:0.1em solid #aaa;}
  10.     table td {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:0.7em; text-align:left;border-top:0.1em solid #aaa; border-left:0.1em solid #aaa;}    
  11. </style>
  12. </head>
  13.  
  14. <body>
  15. <table summary="ejemplo de tabla de datos accesible" cellspacing="0" cellpadding="0">
  16.     <caption>Caption a la izquierda</caption>
  17.     <tr>
  18.         <th>TH 1</th>
  19.         <th>TH 2</th>
  20.         <th>TH 3</th>
  21.     </tr>
  22.     <tr>
  23.         <td>TD 1</td>
  24.         <td>TD 2</td>
  25.         <td>TD 3</td>
  26.         <td>TD 4</td>
  27.     </tr>
  28.     <tr>
  29.         <td>TD 5</td>
  30.         <td>TD 6</td>
  31.         <td>TD 7</td>
  32.         <td>TD 8</td>
  33.     </tr>
  34. </table>
  35. </body>
  36. </html>

En ese ejemplo los td no me ponen por debajo del caption sino por debajo de los th y yo quiero que queden por debajo del caption y los th. ¿Alguna solución?

-------------------

Mi segunda duda es si se puede poner la tabla en vertical, es decir, sabemos que la tabla por defecto está así:
<th><th><th>
<td><td><td>
<td><td><td>

Y en vertical tendría que ser así:
<th><td><td>
<th><td><td>
<th><td><td>

¿Se puede? He mirado muchos ejemplos en Google y también en ese foro, pero no encuentro lo que necesito.

Un saludo