This applies it to all tables in my project. My wonderful users have decided that one particular table needs to have no gridlines. The w3c site says that border-style: hidden; will override this but when I apply this to my table the gridlines are still
there. It doesn't matter if it is in the HTML, code behind after
.Style.Clear(), or in another style class, it just doesn't work. Is there some way I'm missing to override the "table td" type of style?
Thanks for the reply Curt. I changed my td tags in the HTML to be like this:
<td style="border:hidden;">
and it renders to the browser that way. The problem is that when I pull it up in IE 7 the border is still there. In a page without the CSS class in the style sheet the table has no border.
I stripped the source from view->source down to just the code below and opened that in IE 7 and got the same thing. The w3c site says this is wrong and inline should override a style class in the header. Do you know of any fix?
</style>
<table class="bdrless">
<tr>
<td>one</td><td>two</td>
</tr>
<tr>
<td>one</td>
<td>two</td>
</tr>
</table>
You have to put the style only in the <table> tag, nowhere else. Isn't it simple?
Excellent! Yes it is simple and works great. You just saved me a lot of trouble. I'm still wondering why the order of processing and order of precedence both of which are defined by the w3c and should control this situation are ignored by IE 7 but I guess
that is for MS to figure out. As long as this method works I'm good to go.
kraznodar
Contributor
3332 Points
881 Posts
is there a way to override a CSS style of: table td{} on just one of several tables?
Aug 13, 2008 08:12 PM|LINK
In my style sheet I have this:
table td
{
border-width: 1px;
border-color: Black;
border-collapse: True;
border-style: Solid;
}
This applies it to all tables in my project. My wonderful users have decided that one particular table needs to have no gridlines. The w3c site says that border-style: hidden; will override this but when I apply this to my table the gridlines are still there. It doesn't matter if it is in the HTML, code behind after .Style.Clear(), or in another style class, it just doesn't work. Is there some way I'm missing to override the "table td" type of style?
Curt_C
All-Star
66014 Points
7639 Posts
Moderator
Re: is there a way to override a CSS style of: table td{} on just one of several tables?
Aug 13, 2008 08:42 PM|LINK
if you set it right in the tag for that TABLE it will override the CSS value(s).
v5.1 of iTracker (Inventory Tracker Starter Kit) is out, Download it now!
sappidireddy
Participant
917 Points
221 Posts
Re: is there a way to override a CSS style of: table td{} on just one of several tables?
Aug 13, 2008 08:52 PM|LINK
Create a different class for that table and assign it.
You can overide css by specifying !Impartent like below
background-image
: none !important;Venkat
Dont forget to click "Mark as Answer" on the post that helped you
kraznodar
Contributor
3332 Points
881 Posts
Re: is there a way to override a CSS style of: table td{} on just one of several tables?
Aug 13, 2008 09:21 PM|LINK
Thanks for the reply Curt. I changed my td tags in the HTML to be like this:
<td style="border:hidden;">
and it renders to the browser that way. The problem is that when I pull it up in IE 7 the border is still there. In a page without the CSS class in the style sheet the table has no border.
I stripped the source from view->source down to just the code below and opened that in IE 7 and got the same thing. The w3c site says this is wrong and inline should override a style class in the header. Do you know of any fix?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head><title>
LES CFAS
</title>
<Style>
table td
{
border-width: 1px;
border-color: Black;
border-collapse: True;
border-style: Solid;
}
</style>
</head>
<body>
<div id="ctl00_CfasContent_GasPanel">
<table style="border:hidden; border-right:hidden; border-left:hidden; border-bottom:hidden; border-top:hidden;">
<tr>
<td style="border:hidden; border-right:hidden; border-left:hidden; border-bottom:hidden; border-top:hidden;">
<input id="ctl00_CfasContent_rbGasPercentCC" type="radio" name="ctl00$CfasContent$Gas" value="rbGasPercentCC" />
</td>
<td style="border:hidden; border-right:hidden; border-left:hidden; border-bottom:hidden; border-top:hidden;">
<input name="ctl00$CfasContent$txtGasPercentCC" type="text" id="ctl00_CfasContent_txtGasPercentCC" style="width:50px;text-align: center" size="20" /> test
</td>
<td style="border:hidden; border-right:hidden; border-left:hidden; border-bottom:hidden; border-top:hidden;">% change in natural gas fuel cost ($/MBTU)   <span id="ctl00_CfasContent_RVGas1" style="color:Red;visibility:hidden;">Gas price % change must be between -15 and 15.</span></td>
</tr>
<tr>
<td style="border:hidden; border-right:hidden; border-left:hidden; border-bottom:hidden; border-top:hidden;">
<input id="ctl00_CfasContent_rbGasDollarCC" type="radio" name="ctl00$CfasContent$Gas" value="rbGasDollarCC" />
</td>
<td style="border:hidden; border-right:hidden; border-left:hidden; border-bottom:hidden; border-top:hidden;">
<input name="ctl00$CfasContent$txtGasDollarCC" type="text" id="ctl00_CfasContent_txtGasDollarCC" style="width:50px;text-align: center" size="20" />
</td>
<td style="border:hidden; border-right:hidden; border-left:hidden; border-bottom:hidden; border-top:hidden;">$/MBTU change in natural gas fuel cost   <span id="ctl00_CfasContent_RVGas2" style="color:Red;visibility:hidden;">$/MBTU change must be between -5 and 5.</span></td>
</tr>
</table>
</div>
</body>
</html>
NHOQUE
Contributor
5103 Points
851 Posts
Re: is there a way to override a CSS style of: table td{} on just one of several tables?
Aug 14, 2008 12:28 AM|LINK
Try the following. You dont need to go through each "td" and put inline style. Here is the simplest one,
<html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Borderless Table</title> <style type="text/css"> table td { border-width: 1px; border-color: Black; border-collapse: True; border-style: Solid; } table.bdrless td{ border-width: 0px; } </style> </head> <body> <form id="form1" runat="server"> <div> <table> <tr> <td>one</td> <td>two</td> </tr> <tr> <td>one</td> <td>two</td> </tr> </table> <br /> <table class="bdrless"> <tr> <td>one</td><td>two</td> </tr> <tr> <td>one</td> <td>two</td> </tr> </table> </div> </form> </body> </html>You have to put the style only in the <table> tag, nowhere else. Isn't it simple?
Thanks.
[n°web]
kraznodar
Contributor
3332 Points
881 Posts
Re: is there a way to override a CSS style of: table td{} on just one of several tables?
Aug 14, 2008 03:16 PM|LINK
Excellent! Yes it is simple and works great. You just saved me a lot of trouble. I'm still wondering why the order of processing and order of precedence both of which are defined by the w3c and should control this situation are ignored by IE 7 but I guess that is for MS to figure out. As long as this method works I'm good to go.