Change a table display based on screen size


I want to display a relatively large table of data with dash. I would like this table to be displayed horizontally on large screens and vertically stacked on mobile. I am happy to do something like if screen-size > XXpx then show the horizontal table otherwise show the vertical table (hence have two tables and show the relevant one)

Obviously I can add a button where the user chooses what he/she prefers but it would be nicer to have the behaviour naturally.

Is it possible to do that with Dash ? I can’t find a way to access the screen size nor find articles talking about it?

Many Thanks,

check out responsive design techniques in css. the simplest might be to return two tables and hide one of them depending on the screen size in the media query.

Hey Chriddyp, any idea how that might look like in code?