Respuestas de foro creadas

Viendo 4 respuestas - de la 1 a la 4 (de un total de 4)
  • Iniciador del debate ruvilar

    (@ruvilar)

    Hola, si ya está todo resuelto. Un saludo y gracias!

    Iniciador del debate ruvilar

    (@ruvilar)

    Okay gracias por responder, voy a intentar improvisar variantes. Saludos!

    Iniciador del debate ruvilar

    (@ruvilar)

    Hola, si están hechos con Div las tablas de esa página que te mencioné, por lo que veo que con Table no hay manera de llevarlo a cabo porque se anidan todos los encabezados por una lado con Thead y todo el resto de celdas con Tbody, de manera que los encabezados en versión Escritorio siempre se verán arriba y no a la izquierda.

    Por lo tanto, quiero saber en este caso con Div, como se lleva a cabo esta reducción de columnas a la derecha manteniendo en cualquier versión el encabezado a la izquierda.

    Un saludo!

    Iniciador del debate ruvilar

    (@ruvilar)

    Hola Adrian,

    muchísimas gracias por responder de antemano.

    Mira te cuento, ejemplos a lo que me refiero hay en todos lados, pero solo los he visto con los encabezados en la parte superior de la tabla en versión Escritorio. Aquí lo que quiero es que los encabezados permanezcan siempre a la izquierda en cualquier versión, tanto Escritorio como Móvil.

    En este caso, por más que yo cree las celdas tanto con Div como con Table, el ejemplo final será el mismo para desarrollar este ejemplo. Yo prefiero Table para darle semántica a la web.

    Un ejemplo claro es la tabla comparativa que hay en la siguiente URL: comprarmisprismaticos. com

    … si haces un poco de scroll, verás que la tabla muestra los encabezados a la izquierda en versión Escritorio.

    Te invito a que compruebes cuando reduces la ventana del navegador y ver cuando pasas a versión Móvil, como se restan las celdas de la derecha y pasan a estar una debajo de la otra, manteniendo el encabezado siempre a la izquierda, dicho encabezado se repite una y otra vez debajo del siguiente producto conforme cuantas columnas tenga la tabla.

    La idea es que los detalles de cada producto se puedan visualizar en vertical siempre.

    Esta clase de tablas adaptativas son buenas para tablas pequeñas como las que hay en ese ejemplo y por el cual quiero crearla, porque hasta ahora solo tengo que usar el tipico Overflow-x: auto y Display: block para que la tabla se pueda visualizar en su totalidad hacia la derecha, lo cual ya no queda tan bien como antes.

    Eso es todo. Si tienes una respuesta a esto, te lo agradeceré.

    Un saludo!

Viendo 4 respuestas - de la 1 a la 4 (de un total de 4)