0

I have a image in my page, when i mouse over that image text-decoration:underline; css property is not working...

<div class='imgover'>
   click me<img  src='http://www.google.co.uk/images/srpr/logo3w.png' alt='Img' />
</div>

css class is given below,

.imgover:hover
{    
    text-decoration:underline;
}

refer this link http://jsfiddle.net/smanimani/cwnwK/1/

but the text-decoration is working fine for text, but it's not working for image...!

How do i solve this?

Thanks in advance....!

2 Answers 2

0

Use

.imgover:hover 
{     
border-bottom: 1px solid red; 
} 
2
  • Hi @Jawad... Thanks for ur reply.... border-bottom is also a good solution for this.. but, i want to know, why 'text-decoration' is not working.... Oct 12, 2012 at 12:30
  • text-decoration is for text - as Mark said in the other comment, the only CSS property related to text that works for images is text-align.
    – Tom Oakley
    Oct 12, 2012 at 14:22
0

change from :

.imgover:hover {    
  text-decoration:underline;
}

to this:

.imgover:hover {     
  border-bottom: 1px solid #000; 
}

text-decoration is used for text, border-bottom can be used for everything.

The only text-related CSS property that works by images is text-align.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.