Css for specific rows and columns of a table
I have a lot of html tables and one of them is called "table1". I want to style this table only. I used:
#table1 tr,th,td
{
border: 5px solid black;
}
But when it is executed, another table style is td , tr, th
set the same as the style #table1
.
How can I style a specific table td , tr, th
only ????
source to share
You need to specify a parent for th
both andtd
#table1 tr, #table1 th, #table1 td {
/* ... */
}
otherwise you will apply this style to
-
#table1 tr
(everythingtr
inside#table1
) -
th
(allth
no matter where they are) -
td
(alltd
no matter where they are)
As an additional note, a :any
pseudo-class is available in some modern browsers (with the prefixes -moz-
and -webkit-
), so once it is implemented more consistently you can write
#table1 :any(tr, th, td) {
...
}
it is helpful to avoid repetition.
source to share