I'm trying to place a data table on my web page. The problem is I've already set the styles for table, th, td, etc. I want the second table to look different, to accomodate its much larger size. However, whenever I try to declare a style with, say, <table1> it doesn't work correctly. You can see how I've used my first table on my page (first link). Then notice the second table at another site, which I want to copy almost exactly to my site (second link). Then look at their source and mine. Talk about gigantic and bloated. Is their an easier way???
<!-- m --><a class="postlink" href="http://www.freewebs.com/kentuckyweightlifting/kentuckyweightliftingcalendar.htm">http://www.freewebs.com/kentuckyweightl ... lendar.htm</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.usaweightlifting.org/2004_q_totals.htmlThey">http://www.usaweightlifting.org/2004_q_totals.htmlThey</a><!-- m --> have just copied the table from Excel or Word with all the excess baggage.
Start by putting your data into a simple table and then use css to alter the colors , borders, font etc.What I originally meant was that I wanted to define 2 seperate tables. I think I have figured it out though. I simply defined the style for each table on that particular page. It works (at least in Firefox, though I haven't tried anything else) I had to delete all table styles on the css page for it to work though. One more thing: how can I make the td/th borders become one shared border, instead of wrapping each individual cell? Check it out:
<!-- m --><a class="postlink" href="http://www.freewebs.com/kentuckyweightlifting/qualifyingtotals.htmDoes">http://www.freewebs.com/kentuckyweightl ... ls.htmDoes</a><!-- m --> this give you a few ideas?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>table borders</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
<!--
table {margin-top:10px;}
#first th {background:#ff9;}
#first td {border:0; border-top:1px solid #ccc; text-align:center;}
#second th {background:#9cf;}
#second td {border:0; border-left:1px solid #ccc; text-align:center;}
-->
</style>
</head>
<body>
<table id="first" border="1" cellpadding="5" cellspacing="0" summary="">
<tr><th>Weight Class</th><th>World Team</th><th>Super Squad</th></tr>
<tr><td>51kg </td><td>-</td><td>-</td></tr>
<tr><td>56kg</td><td>250.0</td><td>250.0</td></tr>
<tr><td>62kg</td><td>275.0</td><td>275.0</td></tr>
</table>
<table id="second" border="1" cellpadding="5" cellspacing="0" summary="">
<tr><th>Weight Class</th><th>World Team</th><th>Super Squad</th></tr>
<tr><td>51kg </td><td>-</td><td>-</td></tr>
<tr><td>56kg</td><td>250.0</td><td>250.0</td></tr>
<tr><td>62kg</td><td>275.0</td><td>275.0</td></tr>
</table>
</body>
</html>table borders (<!-- m --><a class="postlink" href="http://forums.webdeveloper.com/showthread.php?s=&threadid=33120">http://forums.webdeveloper.com/showthre ... adid=33120</a><!-- m -->)
<!-- m --><a class="postlink" href="http://www.freewebs.com/kentuckyweightlifting/kentuckyweightliftingcalendar.htm">http://www.freewebs.com/kentuckyweightl ... lendar.htm</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.usaweightlifting.org/2004_q_totals.htmlThey">http://www.usaweightlifting.org/2004_q_totals.htmlThey</a><!-- m --> have just copied the table from Excel or Word with all the excess baggage.
Start by putting your data into a simple table and then use css to alter the colors , borders, font etc.What I originally meant was that I wanted to define 2 seperate tables. I think I have figured it out though. I simply defined the style for each table on that particular page. It works (at least in Firefox, though I haven't tried anything else) I had to delete all table styles on the css page for it to work though. One more thing: how can I make the td/th borders become one shared border, instead of wrapping each individual cell? Check it out:
<!-- m --><a class="postlink" href="http://www.freewebs.com/kentuckyweightlifting/qualifyingtotals.htmDoes">http://www.freewebs.com/kentuckyweightl ... ls.htmDoes</a><!-- m --> this give you a few ideas?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>table borders</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
<!--
table {margin-top:10px;}
#first th {background:#ff9;}
#first td {border:0; border-top:1px solid #ccc; text-align:center;}
#second th {background:#9cf;}
#second td {border:0; border-left:1px solid #ccc; text-align:center;}
-->
</style>
</head>
<body>
<table id="first" border="1" cellpadding="5" cellspacing="0" summary="">
<tr><th>Weight Class</th><th>World Team</th><th>Super Squad</th></tr>
<tr><td>51kg </td><td>-</td><td>-</td></tr>
<tr><td>56kg</td><td>250.0</td><td>250.0</td></tr>
<tr><td>62kg</td><td>275.0</td><td>275.0</td></tr>
</table>
<table id="second" border="1" cellpadding="5" cellspacing="0" summary="">
<tr><th>Weight Class</th><th>World Team</th><th>Super Squad</th></tr>
<tr><td>51kg </td><td>-</td><td>-</td></tr>
<tr><td>56kg</td><td>250.0</td><td>250.0</td></tr>
<tr><td>62kg</td><td>275.0</td><td>275.0</td></tr>
</table>
</body>
</html>table borders (<!-- m --><a class="postlink" href="http://forums.webdeveloper.com/showthread.php?s=&threadid=33120">http://forums.webdeveloper.com/showthre ... adid=33120</a><!-- m -->)