What is meta? ×
Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 133 Stack Exchange communities.

It must be tough for the old top bar to see its young replacement thriving. Still, it's not a reason to misbehave like this:

Can the rebel icons be shrinked back to their normal size?

Happens in chat lobby of any site (e.g. lobby for Stack Overflow chat) and worth to mention the icons are fine in the old top bar at http://stackexchange.com/ itself.

Chrome 33.0.1750.146 m here but doubt it's browser related.

share|improve this question

closed as off-topic by Anna Lear Apr 15 at 4:15

This question appears to be off-topic. The users who voted to close gave this specific reason:

  • "The problem described here can no longer be reproduced. Changes to the system or to the circumstances affecting the asker have rendered it obsolete. If you encounter a similar problem, please post a new question." – Anna Lear
If this question can be reworded to fit the rules in the help center, please edit the question.

    
Repro-ed on IE11 and Safari 5.1.7 but not on FireFox 27 (win7.x64)! –  rene Mar 6 at 17:04
    
@rene hmm... same machine for all browsers? Firefox has nasty feature of "auto zoom" based on screen resolution maybe this time it actually got useful. :) –  Shadow Wizard Mar 6 at 18:38
    
I rechecked on a different box (same os though) repro in Chrome but not on FF. –  rene Mar 6 at 18:49
    
Reproduced (IE 10 on Win RT). –  michaelb958 Mar 6 at 22:14
    
Why can't we just have the new top bar in chat? –  ɥʇǝS Mar 8 at 1:51
5  
@Seth It's coming in 6-8 weeks. –  Anna Lear Mar 8 at 2:09
1  
Looks like this has been fixed as a side effect of deploying the new top bar to chat. –  Ilmari Karonen Apr 14 at 21:46

1 Answer 1

The problem is that those icon images are directly linking to each site's favicon file. These favicons are .ico files that contain two distinct icon sizes: a small 16×16 pixel icon and a larger 32×32 pixel one.

Since the <img> tag used to load them doesn't specify an explicit size, browsers are free to choose which icon size they'll display. Those that happen to choose the smaller one (Firefox, Opera) look good, while those that pick the larger one (IE, Chrome) look awkward.

A simple CSS fix would be to force the image size down to 16×16 px, e.g. like this:

.siteFavicon img {
    width: 16px;
    height: 16px;
}

In fact, this is exactly what the main stackexchange.com style sheet does, which is why the bug does not occur there.

Still, this is not the perfect fix, since it just scales the larger favicons down. (The 32×32 px icons sometimes look a bit different from the 16×16 px ones; for example, the SO favicon has fewer bars in the stack at 16×16 px.) A better fix would be to change the links to point to PNG images with a known fixed size; an even better fix would be to replace them with CSS sprites, and an even better fix, of course, would be to replace the whole chat top bar with the new one we've got here.

Even so, the simple CSS fix above does more or less solve the problem. While waiting for an official fix, I've added the CSS above to version 1.10 of the Stack Overflow Unofficial Patch.

share|improve this answer

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