Abbr double line dotted

ux
1

Example:

The WHO was founded in 1948.

I see double lines in Firefox 57, Opera 49 / Chrome 62. Internet Explorer / Edge is not affected.

Where find line dotted:


       /* from normalize.scss */
abbr[title] {
    border-bottom: 1px dotted;
}

       /* from browser default stylesheet (user agent stylesheet) */
abbr[title], acronym[title] {
    text-decoration: underline dotted;
}

Maybe disable default css in abbr element (text-decoration: none !important) for better look.

5 Likes
2

Sure what do you think @awesomerobot?

3

Looks like the normalize css (few years old) is styling it differently than those browsers are by default now. The underline should still be there (acronyms should have title attributes, and the underline hints the tooltip) but I’ll update from border to text-decoration so it’s not doubled (IE/Edge likely still need it defined to appear).

ie/edge don’t support dotted text decorations yet, but the basic underline will fallback there.

6 Likes
4

Pushed a commit that will remove double underlines. Thanks @user_checker.

https://github.com/discourse/discourse/commit/efc5bc2c553a600467735ad318f92aa83f00a482

8 Likes