Arvind K. Gupta-Lawrence
Arvind K. Gupta-Lawrence October 05, 2011 09:01

Text with hover-over/acronym feature applied appears underlined with a dotted line in Firefox but not in other browsers

I really like the fact that Firefox automatically underlines any bit of text that has a hover-over feature attached to it. It allows the user to easily recognize the areas he can hover-over to get help or a definition, and we can point it out in instructions. However, there are no visible markers in Internet Explorer or Chrome. I am aware that this might be related to the default behavior of each browser, but would it be possible to program an override that would appear consistently across the various browsers? Is this something we can change in the CSS?
1 person has
this question +1
Reply

  • Oksana EMPLOYEE
    Oksana (WorldAPP Community Manager) October 05, 2011 09:34
    Hi :)

    If that is what you're looking for (click to see an example) I would like to suggest you the following trick:

    1) Please go to the needed question/answer option and insert the tag like I did for my survey: <acronym title="as soon as possible">ASAP</acronym>. Note: if you are inserting tag to the question's field, you will need to disable WYSIWYG editor;

    2) Go to the Layout page > CSS Styles and paste this code: acronym {border-bottom:1px dotted #333}. You can put this line to any part of CSS code. If you need to change the color of the dots, you will want to substitute #333 with the needed color.

    If you have any additional questions, just let us know :)
    Comment
    good answer! good answer! (undo)
  • (some HTML allowed)
    How does this make you feel?     Add Image
    I'm

    e.g. happy, confident, thankful, excited indifferent, undecided, unconcerned sad, anxious, confused, frustrated kidding, amused, unsure, silly

    Cancel