how to change color of href on hover


Tags: html,css,jsp,spring-mvc

Problem :

I have the following code in my jsp:

<a href="#expProd" id="${model.product.actualT[status.index].Id}" class="highlight"><spring:message code="label.actual.expand" /></a> 
                                                                                </div>

Basically i have to change the color to orange when the mouse is over the label and blue as default color. I know how to do it using an id attribute as indicated in this post(HTML / CSS - Hover Link Color since my id is generated as shown below i can't use it:

id="${model.product.actualT[status.index].Id}" 

Any idea how to do it please? I tried using the class tag but it is not working.

Thanks in advance



Solution :

See this fiddle

.highlight:hover{
color:red;
}

    CSS Howto..

    How to get inline style that was overridden by CSS !important using JavaScript

    jquery css how to retain position if you remove margin

    ASP.NET DataBoundField DataFormatString, how can I add html correctly?

    CSS: How do I make a !100% header with a repeat-x background and tip

    Show hidden image with jQuery

    How can I “display:none” to some adjacent text with CSS?

    On click show or hide the children links in javascript or jquery

    how to reposition label which sits on top of the checkbox

    ExtJS how to remove grid row underline when selected and over

    CSS - How to make a div as wide as a containing child img

    How to get and extract matched css rules on dom-node?

    How to inject css into a document via ajax?

    How to style table as responsive using Jquery mobile?

    HTML/CSS How to format Text and have an Image floating next to it

    how to currency convert in java script

    How to join multiple rounded images one by one using line in css or css3

    How to place div in top right hand corner of page

    How to stop text from overlapping CSS?

    How to style the wp_list_page in wordpress?

    How to dynamically create CSS class in IE8

    How to make CSS div width equal to browser width if element is inside wrapper element

    how to create 3 columns in HTML+CSS and group 2 div elements in the third column

    How can one pass component property values to the css/less clientlibs for that component? AEM 6.2

    How to top align two divs inside a third one?

    IcoMoon App icon fonts are shown as 

    HTML element positioning - How do I have an element always stay in the visible area without javascript

    How do I change my link's image on click?

    How do I align a flow element next to a phrasing element?

    How to shift the alignment of text in a select dropdown toward the top and left with CSS?

    How to get the first letter of each word to be a different size and the rest to be the same size