Can I make a table like this with just CSS?

Hi,

I decided to get away from tables a bit and go more CSS. However, I have a graphic oriented table I want to make, but have no clue if it is possible or how to do it.

I am attaching an example.



Any help appreciated. I am looking around and searching, but so far just finding normal table info. Kind of lost on this one.

 

This example looks very easy. You need two divs, both have width=100%
The first one you put in your html will go on top, then the next, underneath.

Now, take this and ask more questions:
http://mikx2.com/demo1.html

 

I understand how to make a basic table, but not a graphic table like the one shown with border, gradient graphic and so forth.

 

Well, 30 sites later, I found an example that kind of does what I was looking for. Now on to the experimentation.

Think I was making it more complicated than it was.

 

Here's an example that does precisely what you're looking for, according to the picture in your original post

http://www.paulhirsch.com/ex/div_not_table/index.html

Just view the source and you'll see how it was constructed. It really is very easy!

 

gradient how?

 

Oh yeah? BG pic!

 

Bingo

Here's a link to the background image. There isn't much to it - http://www.paulhirsch.com/ex/div_not_table/bg.png

But don't be surprised when the day comes you'll be able to create gradients like this using code only!

 

Yea, I spent hours last night playing around and made my table.

I am liking CSS more and more now. Up until now I have only used CSS for some simple attribute changes mainly.

 

You can't, tables are for "DATA", css are for "designs". I suppose just make a jpg as a bg.

 

I made the above table utilizing CSS for attributes and positioning just fine.

In the past, I would have made the entire table and sliced it up then done a bunch of bg's on cells. CSS makes it easier and cleaner.