Icons in the toolbar are distorted with IE and zoom != 100%

[Alfonso Martínez de Lizarrondo]

as reported in ​http://cksource.com/forums/viewtopic.php?p=43055#p43055 using IE with a zoom level different than 100% will distort the icon images in the toolbar. The problem is also present in the context menu.

But the v2 skin doesn't suffer the problem in the toolbar, I've checked and adding a background color to the

.cke_skin_v2 .cke_button a,
.cke_skin_v2 .cke_button a.cke_off
{
	filter: alpha(opacity=70); /* IE */
	opacity: 0.70; /* Safari, Opera and Mozilla */
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}

rule fixes the problem. I haven't searched the fix for the context menu.

So the fix would need to find the correct color for the skin (maybe that means problems with Kama) and also the rule to fix the context menus.

[Frederico Caldeira Knabben]

This looks like the old an known issue related to Clear Type on Windows. In effect, as pointed by the reporter, it's enough to set the background color to workaround it.

[Alfonso Martínez de Lizarrondo]

#5075 has been marked as dup

[Frederico Caldeira Knabben]

It has nothing to do with ClearType, but the same fix solves the problem.

[Paweł Wilk]

The problem also appears with webkit based browsers. Oryginally bug was reported on ​http://drupal.org/node/783178 .

[Alfonso Martínez de Lizarrondo]

Replying to pwilk:

The problem also appears with webkit based browsers. Oryginally bug was reported on ​http://drupal.org/node/783178 .

This issue isn't related to webkit at all as the description of the problems is totally different.

[Garry Yao]

The background-color fix proposed by Alfonsoml works, but as we know it's hardly deliverable on kama skin, I can confirm that it's related to the 'block'/'inline-block' display of <a> element, could we look for a way to put the <a> inline and having the inner button displayed as block instead?

[Sa'ar Zac Elias]

I did some research and found a fix that resolves the issue, I'll post something soon.

[Sa'ar Zac Elias]

It might seem a bit weird fix, but it works perfectly.
V2 skin is also affected but the impact is much less drastic.

[Frederico Caldeira Knabben]

Interesting solution, and it works "almost" perfectly.

The only problem is IE6. The icons are not broken on that browser. They are not visible anymore.

Considering that this ticket doesn't touch IE6 (as it has no zoom feature, only text size), the proposed patch should not change the current solution we're using for that browser. Note that it still need to be fixed for IE8+Quirks.

[Sa'ar Zac Elias]

Targeting the fix only to IE7+.

[Frederico Caldeira Knabben]

We may be aware of unexpected issues regarding these filters usage. So, I'm re-targeting it just to be sure.

[Frederico Caldeira Knabben]

Will we have the same issue with IE9? If so, we'll have to add still more CSS code to that browser, and the same to IE10 later, and so on.

So, for now, I would make it a way that the fix is applied to all IEs, and then canceled on IE6 only.

[Sa'ar Zac Elias]

Fixed with [5911].