Forum Moderators: not2easy
It uses tables... (Yes I know, table based layouts are a bad idea nowadays but I'm mainly updating the css as the work load to edit the php and html would be a lot more. Not to mention the cost to the client)
Most of the content is within one table and different pages use different id's depending on the content
eg.
HTML
<table id="maintable1">
<!--some content here-->
</table>
CSS
table#maintable1 {
width:900px;
border:3px double #000;
}
And I was wondering if anyone knew if it would be valid css, and work cross browser if I were to do this
HTML
<table id="maintable1" class="removeborder">
<!--some content here-->
</table>
CSS
table#maintable1 {
width:900px;
border:3px double #000;
}
table#maintable1.removeborder {border:0px;}
Comprende?
I can't simply put
table.removeborder {border:0px;}
in the css as the id overrides the class
Any help will be much appreciated
Cian
table.removeborder {border:0px !important;}
Is this valid/supported?
And also I'm still interested if anyone knows if it is valid/supported to write:
table#maintable1.removeborder {border:0px;}
It would be useful for future reference
Thanks
#maintable1 .removeborder table {border:0px;}
by typing the code like that you would be targeting
a table
nested within an element with the class .removeborder
nested within an element with an id of #maintable1
Thanks any way though
<html>
<head>
<style type="text/css">
table#maintable1 {width:900px; border:3px double #000; }
table#maintable3 {width:900px; border:1px solid #000; }
table.defaultborder {width:900px; border:1px solid #7f7; }
table.removeborder#maintable1 {border:0px;}
table.bigborder#maintable2 {border:5px solid;}
</style>
</head>
<body>
<table class="removeborder" id="maintable1">
<tr>
<td>this is a cell</td>
</tr>
</table>
<br /><br />
<table class="bigborder" id="maintable2">
<tr>
<td>this is a cell</td>
</tr>
</table>
<br /><br />
<table class="defaultborder" id="maintable3">
<tr>
<td>this is a cell</td>
</tr>
</table>
<br /><br />
<table class="defaultborder" id="maintable4">
<tr>
<td>this is a cell</td>
</tr>
</table></body>
</html>
Useful to know, I've tried it a few times before but with the id and class the otherway round like
table#maintable1.removeborder
But I remember it not working in ie6
Cheers
