Good CSS table tool?

Question

It has been a long time since I created the table. I have three different tables in which I need to style that everyone will use the same primary colors, etc., but they all have different shapes / sizes.

I am wondering if anyone knows a good library or tool for creating good html / css tables from JSON or something like that (do you pass some JS or PHP data structure, JSON or Arrays and spit out the HTML / CSS table)? Yes, I use them for tabular data (these are price sheets). Or, if there is a good alternative without a table for displaying tabular data, I'm all ears ...

Here is an example of what the background of the table will look like. Each table will have a different statically "allocated" column (or nothing at all); this is not a hanging effect, but only the called column.

Answer 1

Here's another try: http://jsfiddle.net/wwntH/4/

Answer 2

This is my attempt http://jsfiddle.net/WsheP/

/* you may play with this in javascript to achieve your hover highlight */ table td:nth-child(2) { background-color: #f5772e; border-left: 2px solid #888; border-right: 2px solid #888; } 

OR take a look at this plugin to highlight a hover column.

Notes: you need to add a texture to th so that it meets your requirements and satisfy the gradients as you wish.

Answer 3

Wow, this is really beautiful. You can get a basic view of what you have there, with a little css3. Look at css3 gradients, shadows and rounded corners. The only thing I don’t think you can do is have one row a little higher and lower than the rest of the table.