HOWTO: Another Responsive Data Tables Approach

From the blog:

Another Responsive Data Tables Approach | Brad Czerniak

Chris Coyier posted a nice, working solution to a real problem over at CSS-Tricks. Basically, CSS lets you style your website to look and work well on mobile devices by over-writing the styles of your full-size website. There are performance drawbacks to this approach, but for the most part it’s the best-of-all-possible-worlds solution.

One thorny problem, though, is over-riding the style of certain elements that use the width of the screen liberally by default. One such element is the venerable data table.

Coyier’s solution is great in that each table cell is labeled. However, doing this requires either writing CSS manually for every data table on the site (which is near-impossible for large sites) or having the same thing done with scripting on either the server or client side:

I propose a generalized solution that requires no scripting whatsoever. The drawback of this method, though, is that the cells are not individually labeled.

~ by WPA Staff on May 15, 2012.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: