Opino lo mismo que Maikel, la propiedad inline define el ancho por su
contenido, creo que deberias probar:
.tabla:first-child {
float:left;
/*Todas las propiedades restantes*/
}
.datoTabla {
display: block;
/*Todas las propiedades restantes*/
}
En cuanto a lo de el elemento table, prefierohacer tablas con Divs. Sepan
disculpar si me equiboco, soy nuevo en esto. Saludos
2008/1/28 Maikel Naigt <[EMAIL PROTECTED]>:
> Hola.
>
> Los elementos 'inline' disponen de una anchura definida por su contenido,
> siendo ignorada cualquier definición de anchura en el CSS [1]
> Para lograr el efecto que buscas tendrás que definir .DatoTabla como
> elemento de bloque y flotarlo a la izquierda.
>
> Me gustaría hacerte un comentario. Si, por lo que parece, los datos que
> quieres representar son propios de una tabla, ¿por qué no usas el elemento
> <table> destinado a ello?
>
> [1] http://www.w3.org/TR/CSS21/visudet.html#inline-width
>
> Un saludo,
> David Merino
>
> 2008/1/28 SiMs ViKiTo <[EMAIL PROTECTED]>:
>
> >
> > Hola a todos,
> >
> > Tengo una cuestión de divs que no consigo resolver. Se trata de una
> tabla,
> > en la que las columnas son de la siguiente clase CSS:
> >
> > .DatoTabla{
> > font-size: 12px;
> > font-weight : bold;
> > text-align:left;
> > width:20%;
> > display: inline;
> > color: #FFFFFF;
> > background-color: #6557D0;
> > overflow:hidden;
> > }
> >
> > Voy colocando las capas una tras otra, y las capas van quedando en
> linea,
> > formando las celdas de la tabla. El problema viene porque en IE el width
> de
> > 20% se cumple, y hace que queden con una separación entre sí, sin
> embargo,
> > en Firefox se quedan juntas, y aparecen los textos pegados unos a otros.
> > Creo que se debe a que Firefox ajusta el tamaño de la capa a su
> contenido,
> > sin embargo IE mantiene cierto tamaño independientemente del contenido
> :S
> >
> > Este es el codigo de la pagina:
> >
> > <div class="Tabla">
> > <div class="DatoTabla">Nombre</div>
> > <div class="DatoTabla">Nick</div>
> > <div class="DatoTabla">Email</div>
> > <div class="DatoTabla">URL</div>
> > </div>
> >
> > donde la clase Tabla es,
> >
> > .Tabla{
> > width:100%;
> > text-align:left;
> > margin: auto;
> > background-color: #D2D8F9;
> > }
> >
> > Muchas gracias
> >
> > Saludos
> >
> > - ViKiTo =)
> >
> > _________________________________________________________________
> > La vida de los famosos al desnudo en MSN Entretenimiento
> > http://entretenimiento.es.msn.com/
> > _______________________________________________
> > Lista de distribución Ovillo
> > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> > Puedes modificar tus datos o desuscribirte en la siguiente dirección:
> > http://lists.ovillo.org/mailman/listinfo/ovillo
> >
> _______________________________________________
> Lista de distribución Ovillo
> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> Puedes modificar tus datos o desuscribirte en la siguiente dirección:
> http://lists.ovillo.org/mailman/listinfo/ovillo
>
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
