Las hojas de estilos en cascada, popularmente conocidos como Cascade Stylesheet, es una de las cosas maravillosas que nos brindaron los browsers -hace unos años atras- para establecer la apariencia de nuestras vistas al usuario en los aplicativos web que desarrollasemos, reduciendo el codigo redundante del formato entremezclado con el HTML.
NO hay duda, las hojas de estilos en cascada o CSS, nos salvaron la vida.
Llegaron para quedarse. Para brindarnos facilidad de uso y ahorro de energia en la construccion de nuestras vistas.
Sin embargo, aquellos que usabamos las tablas para diseñar el layout de nuestras paginas vivimos en carne propia que los DIV brindaban un manejo mas sencillo para la configuracion del layout de nuestras vistas orientadas al usuario.
Las tablas cedieron terreno para dejarle el trabajo del layout a los DIV.
Algunos mencionaban que el performance de pintar: TABLE, TR, TD y demas era mucho mas bajo que al usar los DIV para hacer algo relativamente similar.
Pero entre otros tantos mitos, uno quedo muy claro, usar CSS sobre tablas se complicaba mas de lo debido.
¿A que se debia esto? ¿Acaso NO era sencillo establecer una clase TABLE > TR para aplicar un estilo en particular a dicha combinacion de elementos?
Pues, alli radica uno de los problemas.
El operador > : mayor que, implica que la combinacion se establece entre el ascendente y el descendiente inmediato, sin embargo NO era comunmente usado.
En comparacion al operador tacito, TABLE TR, que aplicaba el estilo a todos los descendientes TR, de primer o enesimo nivel, con respecto al elemento TABLE.
Lo mejor es usar combinaciones de TABLE > TR para aplicar estilos a los elementos internos a un TABLE. Por que de esa manera NO pierdes el control de las cosas que estas desarrollando sobre la vista.
Sin embargo, dicha combinacion nunca funcionaba. ¿Que es lo que pasaba?
Bueno aqui viene la parte mas triste de todo esto embrollo.
Sucede pues, que el elemento TBODY es implicito en la construccion jerarquica de los TABLE, TR y TD.
Es decir, a pesar que explicitamente NO colocases el TBODY luego del TABLE y antes del TR, dicho elemento -el TBODY- se encontraba alli.
Entonces, necesariamente debias establecer tus estilos para las combinaciones TABLE > TBODY > TR si querias aplicar algun estilo para las filas inmediatamente inferiores de un TABLE en particular.
Pequeño detalle ¿cierto? Ahora todo encaja ¿verdad?
Ante dicho truquillo, poco difundido, es que las tablas se alejaron del diseño de los layouts para dejar ese trabajo a los DIV usando propiedades float y clear, segun sea el caso.
Las tablas solo seria usadas para mostrar informacion tabularmente.
Las clasicas grillas de datos y demas relativamente similares.
