The nicEdit editor field is collapsed along the horizontal plane in IE 6 and IE 7. This is not an issue in Firefox. I am marking this issue as critical because the Wysiwyg editor is functionally useless in this state.


sun’s picture

Title: Editor Field is collapsed in IE » NicEdit: Editor field is collapsed in IE
Priority: Critical » Normal
Status: Active » Postponed (maintainer needs more info)

What do you mean with "collapsed"? If you cannot describe it, please attach a screenshot.

Also, did you ensure that this behavior does not occur in the official demos of NicEdit?

Note: Only API issues can be critical. Editor-specific issues are always normal, if not even minor.

livingegg’s picture

Status: Postponed (maintainer needs more info) » Closed (fixed)

Good point. I checked and it turns out that this behavior also occurs in one of the official demos of NicEdit. Basically when viewed in IE the width of the editor will collapse to the width of the smallest icon, unless its parent has an absolute pixel width. IMO its a pretty serious bug, but there have already been a few posts about it in their forums with no reply, so it doesn't seem like they have any intention of dealing with it. Too bad.

dyardley’s picture

There has been an updated release of this. Version 0.9 r22 was released yesterday although without a changelog to be found, I can't say if this fixes the problem or not.

beckyjohnson’s picture

I am running wysiwyg api for drupal 6 and the latest version of NicEdit but I am having the same problem. On some versions of IE6/7 it collapses and on others it doesn't. I'm trying to CSS a solution to this but it's not working out. Any help would be great.


beckyjohnson’s picture

I updated to the latest NicEdit and nothing worked. The js area where the buttons are, are still colllapsing the test area box.

Has anyone else been trying to trouble shoot this? I think it is a Drupal issue, as the NicEdit demos on their site do not collapse in IE 6/7


J V’s picture

Status: Closed (fixed) » Active

Same here on 6.x and 5.x

Collapses to minimal icon width even on demos...
I can make it absolute width, I don't use fluid width themes, too messy... Others can't make it absolute...


This still very much needs work

sun’s picture

Version: 5.x-0.5 » 5.x-1.x-dev
Status: Active » Closed (won't fix)

As mentioned before, this is an issue with the NicEdit editor library. Wysiwyg API does not do anything special here.

beckyjohnson’s picture

This CSS fix does not work in IE 7. Not sure what to do......


weynhamz’s picture

Version: 5.x-1.x-dev » 6.x-2.x-dev
Assigned: Unassigned » weynhamz
Status: Closed (won't fix) » Fixed

Here is a solution,the problem is a bug of the nicEdit editor itsself.
edit your nicEdit.js,
search for
parseInt(e.getStyle('width')) || e.clientWidth
replaced with
e.clientWidth || parseInt(e.getStyle('width'))
and then,everything works well.

sun’s picture

Could you please submit that bugfix to the official bugtracker/forum of NicEdit? With a little luck, we are able to use on of the next versions then.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

lee20’s picture

HmdSmk’s picture

Status: Closed (fixed) » Fixed

There's the solution here:
Within the constructor of "nicEditorPanel", find the line with this content: "this.panelContain.appendTo(e);"; which is currently on line number 660. Then insert the following line of code before that line: = "100%";

And that's all. The Editor will now come up properly in both IE and FF.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

pitxels’s picture

After reading nicedit forums, best solution for me was the same in #9

In my case was like this:

search for
parseInt(B.getStyle('width')) || B.clientWidth
replaced with
B.clientWidth || parseInt(B.getStyle('width'))

So I guess code could change a bit...

surfiend’s picture

The solutions that worked for me were the ones mentioned in #9 and #15.
Changed code in nicEdit.js on lines
- 323: var panelElm = new bkElement('DIV').setStyle({width : (e.clientWidth || parseInt(e.getStyle('width')))+'px'}).appendBefore(e);
- 421: newX = parseInt(e.clientWidth || e.getStyle('width'));
- 1706: this.floating.setStyle({ width : (e.clientWidth || parseInt(e.getStyle('width')) )+'px' });
Hope this helps (;

chiappa’s picture

Good try, but no it does not. You are not explaining what you are changing to what and those posts you are refering to contain the same stuff.

For me the line of code was:


changed it to:


This stretches the grey bar on the top with the buttons but the text field box stays the same..