Legitimate use for tables... but I want to use CSS. How?

I think you will find that you cannot do it with any less code using css because:

each row will need to be in line, so you will most likely have to put in a block element probably a div for each row. Equivalent to a <tr> tag

each cell of the "table" must be aspecific width, so that all the columns line up. Each cell must be wrapped in a span or something. equivalent to a <td> tag.

You then have to add classes to your "cells" so that each of them has a specific width that matches the rest in it's column.

Looking at the above you can see that you actually end up with more code for the table.

The best bet is to remove any html attributes from the td's and tr's - set the widths in the heading cells (or not at all).

BTW You do realise that by letting a user enter a query directly into the database you have a security nightmare on your hands???

Are you using this?:

table{
table-layout:fixed;
}

It should speed up your tables.

Thanks for the fast replies!

I will respond to the replies in the order they were posted.

I am not trying to use less code, I am just trying to use something other than a table to display the data. The reason is that in IE data in a table will not be displayed until all of it has been received. In other words it doesn't display one line at a time. This causes the page to be blank for a period of time, depending on how much data is returned.

I am currently not setting the widths, but it still does not speed up the display.

It is on an intranet so I am not worried about it. Also, I have checks put in place so that people can only put in a select statement.

I was not using that. I have not heard of it until now. I tried that and it did speed up the display. The rows were displayed one at a time instead of waiting for all of them to be rendered. Unfortunately, I cannot use this because of the type of data I am displaying. Some columns have large lengths and other columns only have 3 characters. When I use this the columns with a large length are scrunched up very small and they are very hard to read.

Thanks for the suggestions, but so far none of these will work.

Here are the thoughts that I had:

I am using ASP and am getting the results to a 2D Array using the getRows method of the result set.

The traditional, and my first, way of thinking is to loop through the rows and then have another loop to go through the columns. This you would end up with something like this for each row:

<div>
  <span></span>
  <span></span>
  ...
</div>

Unfortunately this will not work. Either the columns will be fixed width (which won't work because you don't know how long the value in the field is), or the "columns" will not be lined up.

So, after "thinking outside of the box", or in this case "thinking outside of the table" I thought of this idea. I wanted to run it by other people before I started coding.

Instead of writing out data one row at a time, I could write out the data one column at a time. Thus, for each column I would have something like this:

<div>
  <div></div>
  <div></div>
  <div></div>
  ...
</div>

The outer div would represent a column and the inner divs would represent the individual cells in a column. Each outer div would be floated to the left so that they would all display side-by-side.

Before I go at it coding, does anyone have any comments/suggestions about this? Do you think it will or will not work?

Thanks!

you would still have to set heights for the cells to get rows to line up. This will cause a problem in IE if the content exceeds the cell height as IE will cause the divs to expand vertically and this will cause the rows to miss-align.

This would also result in the each column getting displayed in turn, rather than entire records, which will not be any more useful IMHO than having to wait for the entire thing

I have an idea though. Dunno if you will like it but it may help:

loop through the records as you are. At the end of every 10th record, insert:

    </table><table>

So you get ten records at a time. This of course will lose you some columnar alignment. For this I would do a quick server-side function to analyse the content of the fields and decide what percentage for each column in the the table to display.