10

I have been roaming around Stack Overflow websites and when I was in chat and when I copied SO User Link I got this,

enter image description here

Just as Stack Overflow. But when I moved my mouse on tags I got red lines under that tag .

enter image description here

So I was just wondering that, Is there any specific reason for this red line? As in any of the website when we are hovering we don't get like this.

11
  • this underline is just indicates the hyperlink. if you move your mouse to other link in the SO user link then you will get same line but with different color. color might be vary for different style.
    – Shell
    Feb 22, 2014 at 10:23
  • Please check SO or just check hover effect of this page it self.. there is no red line here...@Nimesh Feb 22, 2014 at 10:25
  • possible design issue..
    – Shell
    Feb 22, 2014 at 10:28
  • I don't think so Feb 22, 2014 at 10:33
  • 4
    I'm getting a blue line, and now I can't for the life of me remember if that was always there. Details details detail details grrrr.
    – Tim Post
    Feb 22, 2014 at 10:34
  • @TimPost i am sorry i dont get your comment Feb 22, 2014 at 10:59
  • What version of IE are you using? Feb 22, 2014 at 12:58
  • I can confirm this in IE9.
    – Sumurai8
    Feb 22, 2014 at 21:00
  • Confirmed in Chrome 33. Feb 22, 2014 at 22:24
  • Chrome 32 has a blue line.
    – lnafziger
    Feb 22, 2014 at 23:13
  • This is chrome 33.0.1750.117 Feb 24, 2014 at 4:01

1 Answer 1

2

This seems to be a simple oversight in the chat style sheet. The following extra rule should fix it:

.ob-post-tags a:hover, .ob-user-tags a:hover { text-decoration: none }

I'll include this fix in the next release (v1.8) of SOUP, if it doesn't happen to get fixed before that.


Edit: SOUP 1.8 is out now, and includes this fix. However, it turns out that, while the CSS fix above works fine for tags inside post / user oneboxes, it doesn't stop the same bug from happening with tags manually included in chat messages.

Alas, there doesn't seem to be any easy way to fix this using CSS. The problem is that the HTML markup for tags in chat currently looks like this (line breaks and indentation added):

<a href="http://meta.stackexchange.com/questions/tagged/chat">
  <span class="ob-post-tag" style="background-color: #E7E7E7;
        color: #6F6F6F; border-color: #6F6F6F; border-style: solid;">
    chat
  </span>
</a>

Since parent selectors are not yet part of any current CSS standard (or browser feature set), there's no good way to select those <a> tags for styling without also affecting all other links in chat. The closest I can get is something like a[href*="/questions/tagged/"], but that'll also match any URLs to tag pages someone might post in chat without using the actual tag syntax. Fixing this in JavaScript isn't so easy, either, since the SE chat implementation provides no easy way for third-party code to tell when new messages are received.

(Actually, while writing this, I thought of an ugly way to do this "at the last minute" using jQuery mouse event delegation. If it works, I may include it in the next SOUP release.)

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .