Link to home
Start Free TrialLog in
Avatar of faruquis
faruquis

asked on

Changing hyperlink style in the datagrid using CSS

I want to change the header hyperlink which is automatically created as i have enable sorting in the datagrid. the problem is that default hyperlink of css class has been applied to the header links of datagrid and i dont want that. I need to change the style.... here is the code

<asp:BoundColumn DataField="NAME" SortExpression="Name" HeaderText="Student Name"></asp:BoundColumn>

the Student Name is the hyperlink on the header of the datagrid and i need to change its style. Plesase give me the css class and where to apply that class to change the header hyperlink .

Also i have enabled paging in the datagrid... and below pages hyperlink are show 1 2 3 4 5 ... and hyperlinks again in default colors... and i dont want that... please do let me know how to change that also... actually the problem is to change the hyperlink styles in the datagrid in short.

Thanks and Regards
Avatar of mmarinov
mmarinov

Hi faruquis,

use this

            <asp:BoundColumn DataField="NAME" SortExpression="Name" HeaderText="Student Name">

               <HeaderStyle CssClass="Your css class name">
               </HeaderStyle>

               <FooterStyle CssClass="Your css class name">
               </FooterStyle>

            </asp:BoundColumn>


Regards!
B..M
Avatar of faruquis

ASKER

no sir.. it isnt working... my class name is datagridlinks and i aplied the class as told by you... the generated code is this... and the class is not applied to the <a href...... take a look

<td class="datagridlinks"><a href="javascript:__doPostBack('reportData$_ctl2$_ctl0','')">Student Name</a></td><td>
you have to declared the class like this
.LNnTxt1 { FONT-SIZE: 11px; COLOR: #000099; FONT-FAMILY: arial, verdana, helvetica, sans-serif; }
A.LNnTxt1:link {       FONT-SIZE: 11px; COLOR: #000099; FONT-FAMILY: arial, verdana, helvetica, sans-serif;}
A.LNnTxt1:visited {      FONT-SIZE: 11px; COLOR: #000000; FONT-FAMILY: arial, verdana, helvetica, sans-serif; }
A.LNnTxt1:active {      COLOR: #ff0000; }
A.LNnTxt1:hover {      COLOR: #990000; TEXT-DECORATION: none; }

and then add LNnTxt1 as a class name to the header/footerstyle

B..M
this is not a valid answer.. have been able to find a valid solution and implementted that also.. thanks for you time buddy.. here is the solution

http://blog.daveranck.com/archive/2004/07/17/216.aspx
ASKER CERTIFIED SOLUTION
Avatar of modulo
modulo

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial