I want to put two tables (on the same page) which should render differently (i.e. use different CSS for each table). Is it possible?
-
7Assign different CSS classes to each?– trojanfoeNov 3, 2011 at 8:54
-
1This is a very good question. Why is it labelled off-topic??? According to the tags, it is very on-topic! I think that this "banning" does not meet Stack Overflow guidelines and that such bannings must be banned! :)– ApostolosDec 15, 2020 at 9:55
5 Answers
In your html
<table class="table1">
<tr>
<td>
...
</table>
<table class="table2">
<tr>
<td>
...
</table>
In your css:
table.table1 {...}
table.table1 tr {...}
table.table1 td {...}
table.table2 {...}
table.table2 tr {...}
table.table2 td {...}
You need to assign different classes to each table.
Create a class in CSS with the dot '.' operator and write your properties inside each class. For example,
.table1 {
//some properties
}
.table2 {
//Some other properties
}
and use them in your html code.
Of course, just assign seperate css classes to both tables.
<table class="style1"></table>
<table class="style2"></table>
.css
table.style1 { //your css here}
table.style2 { //your css here}
<table id="table1"></table>
<table id="table2"></table>
or
<table class="table1"></table>
<table class="table2"></table>
Of course it is!
Give them both an id
and set up the CSS accordingly:
#table1
{
CSS for table1
}
#table2
{
CSS for table2
}