Opened 8 years ago

Closed 7 years ago

#4821 closed Bug (fixed)

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

Reported by: Alfonso Martínez de Lizarrondo Owned by: Sa'ar Zac Elias
Priority: Normal Milestone: CKEditor 3.5
Component: UI : Toolbar Version: 3.0.1
Keywords: IE Cc:

Description

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.

Attachments (3)

4821.patch (7.8 KB) - added by Sa'ar Zac Elias 7 years ago.
4821_2.patch (11.3 KB) - added by Sa'ar Zac Elias 7 years ago.
4821_3.patch (15.4 KB) - added by Sa'ar Zac Elias 7 years ago.

Download all attachments as: .zip

Change History (21)

comment:1 Changed 8 years ago by Frederico Caldeira Knabben

Milestone: CKEditor 3.3

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.

comment:2 Changed 8 years ago by Alfonso Martínez de Lizarrondo

Cc: Sa'ar Zac Elias added
Keywords: Confirmed added

#5075 has been marked as dup

comment:3 Changed 8 years ago by Frederico Caldeira Knabben

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

comment:4 Changed 8 years ago by Frederico Caldeira Knabben

Milestone: CKEditor 3.3CKEditor 3.4

comment:5 Changed 8 years ago by Paweł Wilk

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

comment:6 in reply to:  5 Changed 8 years ago by 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.

comment:7 Changed 7 years ago by 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?

comment:8 Changed 7 years ago by Sa'ar Zac Elias

Owner: set to Sa'ar Zac Elias
Status: newassigned

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

Changed 7 years ago by Sa'ar Zac Elias

Attachment: 4821.patch added

comment:9 Changed 7 years ago by Sa'ar Zac Elias

Keywords: Review? added

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

comment:10 Changed 7 years ago by Frederico Caldeira Knabben

Keywords: Review- added; Review? removed

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.

Changed 7 years ago by Sa'ar Zac Elias

Attachment: 4821_2.patch added

comment:11 Changed 7 years ago by Sa'ar Zac Elias

Keywords: Review? added; Review- removed

Targeting the fix only to IE7+.

comment:12 Changed 7 years ago by Frederico Caldeira Knabben

Milestone: CKEditor 3.4CKEditor 3.5

comment:13 Changed 7 years ago by Tobiasz Cudnik

Status: reviewreview_passed

comment:14 Changed 7 years ago by Frederico Caldeira Knabben

Milestone: CKEditor 3.4.1CKEditor 3.5

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

comment:15 Changed 7 years ago by Frederico Caldeira Knabben

Keywords: Confirmed IE? removed
Status: review_passedreview_failed

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.

Changed 7 years ago by Sa'ar Zac Elias

Attachment: 4821_3.patch added

comment:16 Changed 7 years ago by Sa'ar Zac Elias

Cc: Sa'ar Zac Elias removed
Keywords: IE added
Status: review_failedreview

comment:17 Changed 7 years ago by Garry Yao

Status: reviewreview_passed

comment:18 Changed 7 years ago by Sa'ar Zac Elias

Resolution: fixed
Status: review_passedclosed

Fixed with [5911].

Note: See TracTickets for help on using tickets.
© 2003 – 2017 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy