CSS-Tabellenrahmen mit mehreren Tabellen

Question

Ich habe zwei Tabellen auf einer Seite. Ich möchte um einen von ihnen herumgrenzen und keine Grenze auf dem anderen. Also benutze ich die ID = "". Aber es grenzt immer noch an beide Tische und ich bin mir nicht sicher warum. Wenn ich table1 für keinen Rahmen ändere, wird der Rahmen an beiden Tabellen entfernt. Bitte geben Sie mir hilfreiche Links oder Ratschläge. Vielen Dank.

table 
 
{ 
 
    border-collapse: collapse; 
 
} 
 

 
#table1 td, tr 
 
{ 
 
    text-align:center; 
 
    border: 1px solid black; 
 
} 
 

 
#table1 th 
 
{ 
 
    background: orange; 
 
} 
 

 
#table2 
 
{ 
 
    margin:auto; 
 
}

<table id = "table1"> 
 
    <th> Header </th> 
 
    <tr> 
 
     <td>row 1</td> 
 
    </tr> 
 
</table> 
 

 
<table id = "table2"> 
 
    <th> Header </th> 
 
    <tr> 
 
     <td>row 1</td> 
 
    </tr> 
 
</table>

Answer 1

Sie haben Ihre Wähler bei #table1 td, tr zu ändern. #table1 td gilt für alle td in #table1, aber tr gilt für alle tr.

So stellen Sie es auf #table1 td, #table1 tr und es funktioniert.

#table1 td, #table1 tr 
{ 
    text-align:center; 
    border: 1px solid black; 
} 

Example