Attempting to apply formatting to one table only

[rishid]

Hi,
I have two tables on 2 diff pages, each with their own id. I cannot figure out a definite way to apply different formatting to each, sometimes I put the # in front, sometimes in back.

Both tables are in DIV tags with different IDs. The tables do not have an ID just the div.

Some of the CSS code that is getting overlapped::::


table, th, td #summarytable{
border:none;
border:1px solid #666;
border-collapse:collapse;
}
#summarytable thead tr th {
background:url(images/greychrome.gif) top left repeat-x;
padding:5px 10px;
font-size:120%;
text-transform:uppercase;
color:#333;
}


Shouldn't this only apply to #summarytable? the properties are being used by #doctable as well. I dont get it. :confused:

thanks

[VIPStephan]

With this CSS you are applying the styles to all <table> elements (no matter what ID or class they have), all <th> elements and the element with ID "summarytable" if it is in a <td>.

Take the first one ("table") out and look what happens.

[rishid]

Ahh it is all coming back to me now, so I use like #layer1 table and then a seperate #layer2 table correct?

Also do most people give the table an ID or the div around a table an ID?
For instance,
<div id="table1" align="center">
<table>
...

OR
<div align="center">
<table id="table1">
...

[VIPStephan]

I depends on the structure of the HTML or your preference/need for it as to what element you assign an ID or class. Look at this (http://codingforums.com/showthread.php?t=80833) post on how to use IDs, classes, and the respective CSS properly.

By the way: For the purpose of having short, clean code the align attribute should be omitted since you can center stuff via CSS too (text-align: center; to be specific).