Wikipedia links have a large upper and lower padding


Back to topics list
[post:554#5825]
Devil Doll

07/09/2012 08:13 PM

Reviews: 365
Posts: 1571

Only recently, links to Wikipedia using the [Wikipedia:] namespace have a surprisingly large upper and lower distance to the rest of the text:



The dotted line is a Firefox feature highlighting the link that was clicked most recently.

This effect is limited to Firefox only; MSIE doesn't have any problems of this kind.
(I did only test with login in Firefox and without login in MSIE though.)
I'm reporting it because the "vanishing check-box" turned out to be a CSS issue and this one might be of a similar kind.

[post:554#5830]
Rebecca

07/10/2012 09:36 AM

Reviews: 23
Posts: 734

I'm not able to reproduce that on:

Firefox 13.0.1 on Windows
Firefox 13.0.1 on Linux
Firefox 8.0.1 on Mac
Firefox 12.0 on Mac
Firefox 13.0.1 on Mac
Chrome 20.0.1132.47 m on Windows
Chrome 21.0.1176.0 on Mac
Chrome 19.0.1084.56 on Mac
Safari 5.1.2 (6534.52.7) on Mac

The CSS class on those links is "interwiki" which should show up with similar things, like ↗tsukaima?

(The vanishing checkbox issue was the Prototype JavaScript library replacing one of the functions I already had in the page.)

Edited on 07/10/2012 07:21 PM.

[post:554#5831]
Devil Doll

07/10/2012 01:31 PM

Reviews: 365
Posts: 1571

Yes, that "tsukaima" link shows the same effect on my PC. (Firefox 13.0.1 on Windows here.)

Where is "interwiki" defined? I can't find it in "http://static-anime.mikomi.org/themes/default/base.2011-07-01-01.min.css".

Edited on 07/10/2012 01:34 PM.

[post:554#5832]
Rebecca

07/10/2012 07:09 PM

Reviews: 23
Posts: 734

It's not currently defined, actually. Looking through the computed styles I don't see anything obviously problematic, but I'm not sure that I would, as it looks fine to me. Ok, let's try another test... does this show the same problem ↗tsukaima?

How about this tsukaima?

Edited on 07/10/2012 07:15 PM.

[post:554#5833]
Devil Doll

07/10/2012 07:38 PM

Reviews: 365
Posts: 1571

The first one does have the problem, the second does not. And I remember the problem having appeared months or even years ago already, and it was linked to that arrow as starting character of the Wikipedia link somehow back then as well.

Test: The "↗" character alone creates that additional space already when I cut & paste it into this input form.

Writing ↗ as "↗" has the same effect but only after "preview"ing this posting.

Edited on 07/10/2012 09:18 PM.

[post:554#5834]
Rebecca

07/10/2012 10:56 PM

Reviews: 23
Posts: 734

Ok, so there must be something about the fonts on your computer, firefox and that unicode character...

[post:554#5835]
Devil Doll

07/10/2012 11:44 PM

Reviews: 365
Posts: 1571

I tried various fonts (letting them overrule the ones CAR is using), and various character encodings in Firefox other than Unicode. The effect doesn't go away. But as it appears to be a local issue somehow you should probably close this bug, even as unresolved.

[post:554#5836]
Rebecca

07/10/2012 11:58 PM

Reviews: 23
Posts: 734

I may look for another way of representing the offsite links, because if it's happening to you, you're probably not alone.

[post:554#5837]
Devil Doll

07/11/2012 12:26 AM

Reviews: 365
Posts: 1571

Remember that it's a Firefox only effect on my side, MSIE doesn't have it (as posted above). So it might be some side effect of me installing additional stuff (plugins) for Firefox (I do upgrade Firefox frequently so it could have been one of these updates but you checked the same versions as mine). And I do consider the arrow intuitive.

Then again, even when I move my userContent.css file away and restart Firefox (and the effects I have configured there vanish, such as my personal link colors overriding site CSS and the like), the arrow still has this excessive character box height.

Another test: It's clearly not CAR related. When I paste the ↗ character into the input form of, say, Google Translate I get the exact same effect.

Edited on 07/11/2012 01:51 AM.

[post:554#5838]
Rebecca

07/11/2012 09:55 AM

Reviews: 23
Posts: 734

Ok, now I feel better. =) Still, I was considering using something like http://fortawesome.github.com/Font-Awesome/, which would get us a consistent arrow as well.

[post:554#5839]
Devil Doll

07/11/2012 04:31 PM

Reviews: 365
Posts: 1571

Nice icons. But wouldn't using this font cause additional traffic (for CAR and/or the visitors)?

[post:554#5841]
Rebecca

07/11/2012 05:35 PM

Reviews: 23
Posts: 734

Like any other static resource, it would be a one time download for visitors to the site, and it can happen asynchronously, so it wouldn't slow initial page load.

[post:554#5842]
Devil Doll

07/17/2012 03:33 PM

Reviews: 365
Posts: 1571

Updated Firefox to 14.0.1. right now. And the "↗" effect is gone!

Reply to this topic Start a new topic
Back to topics list

Community Anime Reviews

anime mikomi org