Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Responsive Tables "collapse rows" method?

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #275217
    procode200
    Participant

    On the CSS-Tricks blog post:
    https://css-tricks.com/accessible-simple-responsive-tables/#article-header-id-2

    They have “Collapse by rows” as a method for making responsive tables.

    How would I make a table that does this?

    #275218
    Beverleyh
    Participant

    Under the Approaches for Responsive Tables heading…

    Collapse by rows: Split each row into its own single column mini-table on small screens. Switching display:table into display:block will cause this with normal table markup.

    There are also other linked articles in the Related Resources section at the bottom of the blog post, so try those for more tips and sample code snippets.

    If you need further help, please post a simple demo in CodePen to show us your code and clearly explain any problems you’re having.

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.