user profile image

Based on: Material Design by Google (http://www.google.com/design/)

Tested on Win8.1 with browsers: Chrome 37, Firefox 32, Opera 25, IE 11, Safari 5.1.7

You can use this table in Bootstrap (v3) projects. Material Design Responsive Table CSS-style will override basic bootstrap style.


  1. will this work in foundation as well?

  2. @ryanhellerud1 I'm sorry, but I don't understand a question. What do you mean?

  3. why is this a material design? it looks like any other html table i've seen in the last 15 years or so

  4. @vsync In this case text fields also looks like any other in material design (except floating labels). And lists. And many other elements. So I think you should ask google about this.

    In guideline they use lists instead of tables, but design principles are same. https://material-design.storage.googleapis.com/publish/v_1/quantumexternal/0Bx4BSt6jniD7d2Z0QURUVk5hV2M/layout_structure_sidenav_structure4.png

  5. Is this code (specifically the CSS) freely reusable in other projects? If so, would you mind clarifying the description with your license/attribution requirements? I'd really like to use this for a Material project in lieu of having an "official" component.

  6. @jmuharsky, All CodePen pens are under MIT License (article about it)

  7. Excelent work! You idea of responsive design to small devices it's revolutionary

Leave a Comment Markdown supported. Click @usernames to add to comment.

You must be logged in to comment.