tinymce icons in internet explorer

2
votes

I'm using TinyMCE but the images for the icons don't show up in Internet Explorer. I've checked the discussion here, but I'm already doing the necessary code right.

In firebug when I'm using firefox, I can check the CSS and I do see that the image (img/icons.gif) is loading, so it must be loading in IE as well, but the toolbar is still blank. If I roll over the toolbar, I get the right tooltips and can figure out which button it is, which means the buttons in the advacned are working. I think the problem is in CSS.

I'm using the latest jQuery version of TinyMCE, and running IE9. When I try it in compatibility view of IE9, it does show up the icons.

Is there any specific CSS that needs to be tweaked for IE9?

2
cssinternet-explorericonstinymce
Which DOCTYPE does your IE show? Which rendering engine is used on page load, without switching the rendering mode manually? - feeela
<!-- DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" --> I'm not too familiar with rendering engines, how can I check which engine is being used? - user961627
My< question was not, which DOCTYPE yuo had insertedm but which one does IE actually see. Open the IE developer tolls and lokk which engine it uses (IE7, IE8, IE9?). - feeela
Okay I've rechecked - no matter which "Browser Mode" I see the page, it's only when I'm using "Document Mode" IE7 that the images show up. - user961627
Are you using a responsive layout? You might want to try this. .mceEditor img { max-width: none; } - newpxsn

2 Answers

2
votes

Are you using a responsive layout? If so, try this: 

.mceEditor img {
 max-width: none;
}
0
votes

In my case the reason was the blocking of download of fonts in the IE-Security-Settings. (IE -> Internet Options -> tab 'security' ) Here the screenshot of the settings in a German IE:

settings dialog in German IE 11

If you cannot change the security settings, You can find a proposal here in TinyMce UserGroup to use a skin that does not use fonts. You can download the skin 'lightgraynofonts' here. Extract the zip-file into a directory /tinymce/skins/lightgraynofonts and initialize the tinymce editor like this:

                tinyMCE.init({
                            selector: ideditor,
                            theme: "modern",
                            skin: "lightgraynofonts",** ...