Rsponsive Design For the Table element

Hi Community,

What would be the best way to tackle responsive design on a table that has 9 columns, wodnering if anyone has a few tips and tricks.

Appreciate all suggestions.

Horizontal overflow scrolling is the first thing that comes in mind.

1 Like

Table responsive design as always be a struggle for web developper :).

The known approachs are

  • As @dorilama says, have a horizontal scroll
  • Group some columns together for displaying information in a same cell
  • Admit that table design is not great for mobile, and use a completly different view, like a grid view with cards

Each solution as pros and cons, and will be implemented differently

2 Likes

Thank you guys ! I havea couple of questions from teh above:

  • Horizontal Overoflw: how do you specify just to be horizontal
  • Foir the grid view wiht cards can you please link an example

Appreciate all the suggestions :slight_smile: