Tabla responsive paso a paso

Para esta tabla responsive me inspiré en la tabla de Chris Coyiers, sobre la que añadí la idea de mantener visible 1, 2 ó 3 columnas y ocultar las otras añadiendo un un símbolo + para volver a mostrarlas. Posteriormente encontré el ejemplo de FooTable que podéis encontrar en mi artículo “Responsive table Best Practices” que se basa en el mismo concepto. Sin embargo en nuestro ejemplo veremos algunas diferencias en el CSS que aportarán valor a este artículo.

Responsive Tables Best Practices

El diseño web responsive (RWD), está tomando cada vez más relevancia y comienza a introducirse en ámbitos donde los layout son más complejos, como el e-commerce y las aplicaciones de gestión. Por eso la comunidad está constantemente buscando soluciones para ofrecer la mejor experiencia al usuario en múltiples dispositivos, desktop, tablet, móvil… Hoy vamos a repasar algunas propuestas planteadas hasta ahora para solucionar las problemáticas tablas de datos en dispositivos móviles: responsive tables.