Curiosidades de CSS

El otro día me surgió la necesidad, osea que lo pidió un cliente, de tener una tabla que se desplaza pero la cabecera siempre se ve, para no perder las referencias de qué contienen cada una de las columnas.

Le dí mil vueltas (algunas rozando lo paranormal) con iframes, divs con la propiedad “position:fixed” y demás cosas. Y cuando tuve acceso a Internet busqué una solución y encontré Pure CSS Scrollable Tables with Fixed Header. Es interesante echarle un ojo, pero tras analizarlo a fondo, se basa en CSS hacks (utilizar errores de parseo de Internet Explorer para que sólo él lea algunas cosas) y, específicamente para IE5, utiliza lo siguiente:

top: expression(<br /> document.getElementById("tableContainer").scrollTop<br /> );

¿Javascript en CSS? Qué raro… ¿Qué será esto? Como me suponía, en la MSDN aparece documentado como si tal, y en el W3C ni habla de él… Osea, que no es estándar, pero con el hack utilizado en esa página se consigue que esto funcione en todos los navegadores.

Puedes leer más sobre expresiones en CSS en CSS Expression Optimization y CSS expressions in browsers other than IE.