William, If you are trying to display tabular data, then by all means, use tables. When people in the CSS/Accessibility world say not to use tables, we mean for layout purposes, not for data.
I admire your effort, but semantic markup means use the structure that is best suited for your content. In this case, that means tables! Sandy Clark -----Original Message----- From: William Bowen [mailto:[EMAIL PROTECTED] Sent: Friday, December 03, 2004 6:42 PM To: CF-Community Subject: Positioning issues with DIVs vs Tables Okay, I'm trying to lay out some tabular data and I'd like to avoid using tables if possible...here is the problem If I do this: <table> <tr> <td class=tableHead style=width:value></td> <td class=tableHead style=width:value></td> <td class=tableHead style=width:value></td> <td class=tableHead style=width:value></td> </tr> <tr> <td class=tableRow1 style=width:value></td> <td class=tableRow1 style=width:value colspan=3></td> </tr> <tr> <td class=tableRow style=width:value></td> <td class=tableRow style=width:value></td> <td class=tableRow style=width:value></td> <td class=tableRow style=width:value></td> </tr> <tr> <td class=tableRow style=width:value></td> <td class=tableRow style=width:value></td> <td class=tableRow style=width:value></td> <td class=tableRow style=width:value></td> </tr> </table> the CSS I have defined for all the table cells works all the time. If I do this: <div class=tableHead> <span style=width:20; position:relative; left:3px;></span> <span style=width:100; position:relative; left:3px;></span> <span style=width:300; position:relative; left:3px;></span> <span style=width:50; position:relative; left:3px;></span> </div> <div class=tableRow1> <span style=width:20; position:relative; left:3px;></span> <span style=width:450; position:relative; left:3px;></span> </div> <div class=tableRow> <span style=width:20; position:relative; left:3px;></span> <span style=width:100; position:relative; left:3px;></span> <span style=width:300; position:relative; left:3px;></span><---- here is where the problem is <span style=width:50; position:relative; left:3px;></span><---- here is where the problem is </div> <div class=tableRow> <span style=width:20; position:relative; left:3px;></span> <span style=width:100; position:relative; left:3px;></span> <span style=width:300; position:relative; left:3px;></span><---- here is where the problem is <span style=width:50; position:relative; left:3px;></span><---- here is where the problem is </div> The CSS works correctly for the first and second "row" (complete div set) and then starts getting a little wonky...it's a minor glitch, but the third and forth Span tags in the third and fourth DIVs (those marked class=tableRow) are shifted to the left about 2px... the CSS for the DIV div.tableHead { background-color: FFCE7B; /*e1e1e1;*/ border-top: 2px black solid; font-weight:bold; padding:3px; vertical-align:top; } div.tablerow1 { background-color: ffffff; border-top: 2px black solid; padding:3px; vertical-align:top; } div.tablerow { background-color: ffffff; border-top: 1px black solid; padding:3px; vertical-align:top; } http://www.users.areva-td.com/index.cfm?pc_ContentID=0AD7ADDF-D849-0A97-3ACF F34D70035A25&site_ID=F9583E62-1031-C102-8F06BAC229595429&listType=2&gd_Train ingCourseID=7E66036D-1031-C102-8ED4278A7B90E389 ~or~ http://tinyurl.com/3p52b Supporting IE 5+ (95%+ of our site hits) first then moving to NN and Firefox (So, yes I know it is not operating correctly in NN and FF) Thanks! -- -- will "If my life weren't funny, it would just be true; and that would just be unacceptable." - Carrie Fisher ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~| Special thanks to the CF Community Suite Silver Sponsor - CFDynamics http://www.cfdynamics.com Message: http://www.houseoffusion.com/lists.cfm/link=i:5:138754 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/5 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:5 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.5 Donations & Support: http://www.houseoffusion.com/tiny.cfm/54
