How to change the color of hyperlink in WebGrid column? RSS

• • Reply
  

  Peter Cong

  Member

  527 Points

  681 Posts

  How to change the color of hyperlink in WebGrid column?

  Mar 08, 2012 06:34 PM|LINK

  Hi, I have this webrid column code which is opening a Jquery dialog for selected record, it works well, but I want to change the column of hyperlnk to Blue color to indicates it is hyperlink.

  grid.Column( columnName: "Name",

  header: "Product Name",

  style: "text-align-left",

  format: (item) => Html.ActionLink((( string)item.Name), "PopUpDetails", new { id = item.id }, new { @class = "popup-link" } )

  ),

   

  I found these codes below and tried to add it to format: row of code in above, but it does not work, it complains I used wrong arguments. Anybody knows how to change the column text color? thanks a lot.

   

  new {
  style = "color: 'blue'",
  onmouseover = "this.style.color='green'",
  onmouseout = "this.style.color='blue'"
  }

• • Reply
  

  jerryjoseph

  Contributor

  6740 Points

  1257 Posts

  Re: How to change the color of hyperlink in WebGrid column?

  Mar 08, 2012 07:13 PM|LINK

  Just add a CSS class with the name popup-link.

  popup-link {
      color: blue;
  }
  
  popup-link:hover {
      color: green;
  }

  Jerry Joseph - MCPD, MCTS
  linkedin | twitter | www.jerryjoseph.net
  • Marked as answer by Peter Cong on Mar 08, 2012 07:46 PM
• • Reply
  

  francesco ab...

  All-Star

  20912 Points

  3279 Posts

  Re: How to change the color of hyperlink in WebGrid column?

  Mar 08, 2012 07:19 PM|LINK

  define this in your css class popup-link that you applied to the link:

  to specify a differen colour when you over it with the mouse just use a rule like:

  a.popup:hover

  {

  color: Red;//put here the color you like when the link is hovered by the mouse.

  }

  Francesco Abbruzzese http://www.dotnet-programming.com/
  Mvc Controls Toolkit | Data Moving Plug-in Videos