Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > ASP .Net > Datagrid CssClass being overridden by TD style

Reply
Thread Tools

Datagrid CssClass being overridden by TD style

 
 
Laurence Neville
Guest
Posts: n/a
 
      09-22-2004
Since I added a style for TD elements to my style sheet I have been unable
to control the look of datagrids using the CssClass properties. Maybe there
is no way round it, but I really need to keep the TD style in place to
control other elements on the page.

Is there a way around this?

Here is the code from my datagrid:

<ASPataGrid EditItemStyle-CssClass="SubNormal"
FooterStyle-CssClass="SubNormal" HeaderStyle-CssClass="SubNormal"
ItemStyle-CssClass="SubNormal" id="MyDataGrid1" runat="server"
CssClass="SubNormal" EnableViewState="True"
Width="100%" BackColor="#ffffff" BorderColor="black" ShowFooter="false"
CellPadding="3" CellSpacing="0"
HeaderStyle-BackColor="#ffcc66" DataKeyField="RowHeading_1"
AutoGenerateColumns="false" OnEditCommand="MyDataGrid1_Edit"
OnCancelCommand="MyDataGrid1_Cancel" OnUpdateCommand="MyDataGrid1_Update">

Here is the code from my CSS file:

BODY, TD, P, LI, BLOCKQUOTE {
font-family: verdana,arial,geneva,sans-serif;
font-size: 13px;
font-weight: normal;
color: #333333;
}

..SubNormal
{
font-family: verdana,arial,geneva,sans-serif;
font-size: 11px;
font-weight: normal;
color: #333333;
}

As you can see, all that I am trying to do is reduce the font in the
datagrid to 11px rather than the standard 13px


 
Reply With Quote
 
 
 
 
GrantMagic
Guest
Posts: n/a
 
      09-22-2004
You can try using skins

http://beta.asp.net/quickstart/aspnet/doc/themes.aspx


"Laurence Neville" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> Since I added a style for TD elements to my style sheet I have been unable
> to control the look of datagrids using the CssClass properties. Maybe
> there is no way round it, but I really need to keep the TD style in place
> to control other elements on the page.
>
> Is there a way around this?
>
> Here is the code from my datagrid:
>
> <ASPataGrid EditItemStyle-CssClass="SubNormal"
> FooterStyle-CssClass="SubNormal" HeaderStyle-CssClass="SubNormal"
> ItemStyle-CssClass="SubNormal" id="MyDataGrid1" runat="server"
> CssClass="SubNormal" EnableViewState="True"
> Width="100%" BackColor="#ffffff" BorderColor="black" ShowFooter="false"
> CellPadding="3" CellSpacing="0"
> HeaderStyle-BackColor="#ffcc66" DataKeyField="RowHeading_1"
> AutoGenerateColumns="false" OnEditCommand="MyDataGrid1_Edit"
> OnCancelCommand="MyDataGrid1_Cancel" OnUpdateCommand="MyDataGrid1_Update">
>
> Here is the code from my CSS file:
>
> BODY, TD, P, LI, BLOCKQUOTE {
> font-family: verdana,arial,geneva,sans-serif;
> font-size: 13px;
> font-weight: normal;
> color: #333333;
> }
>
> .SubNormal
> {
> font-family: verdana,arial,geneva,sans-serif;
> font-size: 11px;
> font-weight: normal;
> color: #333333;
> }
>
> As you can see, all that I am trying to do is reduce the font in the
> datagrid to 11px rather than the standard 13px
>



 
Reply With Quote
 
 
 
 
=?Utf-8?B?SmVyZW15IERhdmlz?=
Guest
Posts: n/a
 
      09-22-2004
The problem is that IIRC the css class for the datagrid is applied to the
<tr> tags and not the <td>, so your first rule applies directly to the <td>
and is overriding the .SubNormal style on the <tr>. (Somebody correct me if
I'm wrong about where datagrid applies css classes.)

To fix this, you can just make your second rule more specific:
..SubNormal TD {
font-size: 11px;
}

Note also that you can take out the other style bits from this rule, since
they are identical to the first rule and will inherit.
For more information about rule specificity and the cascade, see
http://www.w3.org/TR/REC-CSS2/cascade.html#cascade

HTH

"Laurence Neville" wrote:

> Since I added a style for TD elements to my style sheet I have been unable
> to control the look of datagrids using the CssClass properties. Maybe there
> is no way round it, but I really need to keep the TD style in place to
> control other elements on the page.
>
> Is there a way around this?
>
> Here is the code from my datagrid:
>
> <ASPataGrid EditItemStyle-CssClass="SubNormal"
> FooterStyle-CssClass="SubNormal" HeaderStyle-CssClass="SubNormal"
> ItemStyle-CssClass="SubNormal" id="MyDataGrid1" runat="server"
> CssClass="SubNormal" EnableViewState="True"
> Width="100%" BackColor="#ffffff" BorderColor="black" ShowFooter="false"
> CellPadding="3" CellSpacing="0"
> HeaderStyle-BackColor="#ffcc66" DataKeyField="RowHeading_1"
> AutoGenerateColumns="false" OnEditCommand="MyDataGrid1_Edit"
> OnCancelCommand="MyDataGrid1_Cancel" OnUpdateCommand="MyDataGrid1_Update">
>
> Here is the code from my CSS file:
>
> BODY, TD, P, LI, BLOCKQUOTE {
> font-family: verdana,arial,geneva,sans-serif;
> font-size: 13px;
> font-weight: normal;
> color: #333333;
> }
>
> ..SubNormal
> {
> font-family: verdana,arial,geneva,sans-serif;
> font-size: 11px;
> font-weight: normal;
> color: #333333;
> }
>
> As you can see, all that I am trying to do is reduce the font in the
> datagrid to 11px rather than the standard 13px
>
>
>

 
Reply With Quote
 
Eliyahu Goldin
Guest
Posts: n/a
 
      09-22-2004
Try

..SubNormal
{
font-size: 11px!important
}

--
Eliyahu

"Laurence Neville" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> Since I added a style for TD elements to my style sheet I have been unable
> to control the look of datagrids using the CssClass properties. Maybe

there
> is no way round it, but I really need to keep the TD style in place to
> control other elements on the page.
>
> Is there a way around this?
>
> Here is the code from my datagrid:
>
> <ASPataGrid EditItemStyle-CssClass="SubNormal"
> FooterStyle-CssClass="SubNormal" HeaderStyle-CssClass="SubNormal"
> ItemStyle-CssClass="SubNormal" id="MyDataGrid1" runat="server"
> CssClass="SubNormal" EnableViewState="True"
> Width="100%" BackColor="#ffffff" BorderColor="black" ShowFooter="false"
> CellPadding="3" CellSpacing="0"
> HeaderStyle-BackColor="#ffcc66" DataKeyField="RowHeading_1"
> AutoGenerateColumns="false" OnEditCommand="MyDataGrid1_Edit"
> OnCancelCommand="MyDataGrid1_Cancel" OnUpdateCommand="MyDataGrid1_Update">
>
> Here is the code from my CSS file:
>
> BODY, TD, P, LI, BLOCKQUOTE {
> font-family: verdana,arial,geneva,sans-serif;
> font-size: 13px;
> font-weight: normal;
> color: #333333;
> }
>
> .SubNormal
> {
> font-family: verdana,arial,geneva,sans-serif;
> font-size: 11px;
> font-weight: normal;
> color: #333333;
> }
>
> As you can see, all that I am trying to do is reduce the font in the
> datagrid to 11px rather than the standard 13px
>
>



 
Reply With Quote
 
Laurence Neville
Guest
Posts: n/a
 
      09-23-2004
Thanks, adding TD to the .SubNormal rule did the job. I also removed the
redundant rules as you suggested.

Thanks again.

Laurence Neville

"Jeremy Davis" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> The problem is that IIRC the css class for the datagrid is applied to the
> <tr> tags and not the <td>, so your first rule applies directly to the
> <td>
> and is overriding the .SubNormal style on the <tr>. (Somebody correct me
> if
> I'm wrong about where datagrid applies css classes.)
>
> To fix this, you can just make your second rule more specific:
> .SubNormal TD {
> font-size: 11px;
> }
>
> Note also that you can take out the other style bits from this rule, since
> they are identical to the first rule and will inherit.
> For more information about rule specificity and the cascade, see
> http://www.w3.org/TR/REC-CSS2/cascade.html#cascade
>
> HTH
>
> "Laurence Neville" wrote:
>
>> Since I added a style for TD elements to my style sheet I have been
>> unable
>> to control the look of datagrids using the CssClass properties. Maybe
>> there
>> is no way round it, but I really need to keep the TD style in place to
>> control other elements on the page.
>>
>> Is there a way around this?
>>
>> Here is the code from my datagrid:
>>
>> <ASPataGrid EditItemStyle-CssClass="SubNormal"
>> FooterStyle-CssClass="SubNormal" HeaderStyle-CssClass="SubNormal"
>> ItemStyle-CssClass="SubNormal" id="MyDataGrid1" runat="server"
>> CssClass="SubNormal" EnableViewState="True"
>> Width="100%" BackColor="#ffffff" BorderColor="black" ShowFooter="false"
>> CellPadding="3" CellSpacing="0"
>> HeaderStyle-BackColor="#ffcc66" DataKeyField="RowHeading_1"
>> AutoGenerateColumns="false" OnEditCommand="MyDataGrid1_Edit"
>> OnCancelCommand="MyDataGrid1_Cancel"
>> OnUpdateCommand="MyDataGrid1_Update">
>>
>> Here is the code from my CSS file:
>>
>> BODY, TD, P, LI, BLOCKQUOTE {
>> font-family: verdana,arial,geneva,sans-serif;
>> font-size: 13px;
>> font-weight: normal;
>> color: #333333;
>> }
>>
>> ..SubNormal
>> {
>> font-family: verdana,arial,geneva,sans-serif;
>> font-size: 11px;
>> font-weight: normal;
>> color: #333333;
>> }
>>
>> As you can see, all that I am trying to do is reduce the font in the
>> datagrid to 11px rather than the standard 13px
>>
>>
>>



 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Custom dict to prevent keys from being overridden Julien Python 1 08-28-2011 02:38 AM
Style question: SetShutdown/GetShutdown .vs. SetShutdown() overridden Jim Langston C++ 15 02-09-2006 10:21 PM
When/Should we use CssClass property or Style property? Sky ASP .Net Web Controls 2 10-01-2004 07:38 AM
Datagrid CssClass being overridden by TD style Laurence Neville ASP .Net Datagrid Control 2 09-22-2004 01:46 PM
Need help with Style conversion from Style object to Style key/value collection. Ken Varn ASP .Net Building Controls 0 04-26-2004 07:06 PM



Advertisments