PDA

View Full Version : Tables to divs?

Grant Palin
05-23-2003, 07:47 PM
I've been thinking a little while about the argument that tables are meant to be used for tabular information, and not page layout. Check out the page at the link below. See those troop tables? Do you think that information qualifies as "tabular" information, or should I consider converting those to divs?

Here's a link to a page on my website to look at.

http://www.hommworld.net/Homm3/CastleTroops.html
Catman
05-23-2003, 07:50 PM
That's tabular information. Still, I'd change the outer table to a div or just cut it, and you should have a table description attribute to keep Bobby happy.
Grant Palin
05-23-2003, 07:54 PM
Originally posted by Catman
That's tabular information. Still, I'd change the outer table to a div or just cut it...

You mean the one in red?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Castle Troops</title>
<meta name="Heroes of Might and Magic 3" content="HOMM3, Heroes 3, Heroes, Towns, Troops, Artifacts, Spells, Links, Strategy, Map Locations, Secondary Skills, Pictures, Screenshots, Story, Price, Where to buy, 3DO, New World Computing, HOMM Series, Games, Tips, Advice, Cheats">
<link rel="stylesheet" type="text/css" href="styles.css"></head>
<body OnLoad="top.document.title = document.title;">

<center>
<img src="Castle/CastleTroops_title.jpg" width="490" height="214" alt="Castle Troops">


<table border="0" width="100%" cellspacing="5" cellpadding="15">
<tr>
<td>


<table border="1" cellpadding="0" cellspacing="0" width="100%" bordercolor="#C0C0C0">
<tr>
<th colspan="8" width="100%">Level 1 Troops</th>
</tr>

...and you should have a table description attribute to keep Bobby happy.

Do you mean summary?

Who's Bobby?
Catman
05-23-2003, 08:27 PM
Yes, the big one in red.

A table summary describes the content of the table, primarily for screen readers. Bobby is the program which checks the accessibility of your website files.
Grant Palin
05-23-2003, 09:03 PM
All right, the big table should be easy enough to replace with a DIV. Now I just have to do that on all my pages...sigh. At least I don't need to replace all the "data" tables with DIVs...that would be a bugger of a job.

About the table summary, for the data table I gave the code for above, it would be something like summary="Castle level one troops", right?
MotherNatrsSon
05-23-2003, 11:44 PM
Why not just set the table border to "0"????
The attached file has what it looks like without the borders. It keeps the format but loses the interuption of the cell borders and makes it look a little cleaner. It should work fine without going through the hassles of turning it all to divs....
Grant Palin
05-24-2003, 01:01 AM
We were talking about the largest table, the one containing all the others. That's the one in red text in the sample above.
MotherNatrsSon
05-24-2003, 04:17 AM
My apologies for the misunderstanding. I would completely cut the "extra" table. I have not used nested tables like that ever. I would still also get rid of the table borders in the other tables. All you need do is insert a couple line breaks in between the other tables and your all set. I guess be'in a beginner I do not necessarily understand the need for the complexities of making divs to replace the cell. Is it necessary for the css?
ReadMe.txt
05-24-2003, 10:21 PM
on the subject of using divs for layout and tables for data, it doens't work!!!! divs cannot be used for a resizing layout, only for one that is a static size.
russ801
05-25-2003, 12:43 AM
Do you mean using tables for liquid design (layout)?

read this on using Div for LD

http://www.sitepoint.com/article/951
ronaldb66
05-26-2003, 09:48 AM
divs cannot be used for a resizing layout
Sure they can; why not? Ever heard of relative widths? Float?