Qué usar tablas o listas para un boleto?

[neodani]

Iniciado por bng5

No, yo no lo maquetaría con tablas.
Las tablas son muy útiles en muchos casos, pero no creo que este sea uno de ellos.

Creo que usando fieldset, div y listas o listas de definición (dl) te darán más libertad al momento de armar el CSS. Con un mismo HTML podrías darle cualquiera o todas esas estéticas que adjuntaste.

Buenas,

He estado siguiendo tus consejos de evitar las tablas, aunque primero lo empecé con tablas para tener una base. La verdad es que las listas me han ido muy bien para la parte del resumen del boleto, el cual solo tiene dos columnas.

Sin embargo, no sé de que forma transformar la parte de los pronosticos en listas. Dejabo del boleto he puesto un ejemplo del código con listas, como veras no se parece en nada al de las tablas.

Código HTML:

<div class="test">
    <dl>
        <dt id="pronostico_01"></dt>
        <dd><input type="checkbox" id="betchecked_12494171"/></dd>
        <dd>Equipo C - Equipo D</dd>
        <dd>1,30</dd>
        <dd><input type="text" value="" size="4" maxlength="8" id="amount_12488401" tabindex="0"/></dd>
        <dd><a href="#"><span title="Borrar" class="ico_borrar"></span></a></dd>
        
        <dt id="pronostico_02"></dt>
        <dd><input type="checkbox" id="betchecked_12494171"/></dd>
        <dd>Equipo C - Equipo D</dd>
        <dd>1,30</dd>
        <dd><input type="text" value="" size="4" maxlength="8" id="amount_12488401" tabindex="0"/></dd>
        <dd><a href="#"><span title="Borrar" class="ico_borrar"></span></a></dd>
 
 
    </dl>
</div> <!-- fin test -->
 

Código CSS:

.test dl{
    margin-bottom:3px;
    font-size:10px;
    padding:5px;
    width:300px;
    background:yellow;
}
.test dl dt {
    color:#000;
    float:left;
    margin-right:10px;
    padding:1px;
    width:140px;
}
.test dl dd {
    margin:2px 0;
    padding:1px;
    font-weight:bold;
}
 

Ver el ejemplo online
http://neodani.com/fdw/boleto_apuestas/boleto.php

¿Puedes decirme como conseguir que los datos (5 columnas) queden alineadas?

Muchas gracias de antemano!