Opened 12 years ago
Closed 12 years ago
#8404 closed defect (fixed)
InlineEditBox and dijit.Editor have toolbar display glitch in Firefox
Reported by: | Jonathan Bowers | Owned by: | bill |
---|---|---|---|
Priority: | high | Milestone: | 1.3 |
Component: | Editor | Version: | 1.2.3 |
Keywords: | Cc: | ||
Blocked By: | Blocking: |
Description
If you use an InlineEditBox? with dijit.Editor as the editor in Firefox (tested in FF3 on Windows and Linux) the toolbar appears offset and displays lower than it should. It is also accompanied by some kind of grey vertical bar/artifact.
This can be reproduced under the dijit/tests/test_InlineEditBox.html and scrolling down to the Editor section.
This problem is purely cosmetic when autosave is disabled, however, if autosave is true and editorParams="{height:}" the toolbar will overlap the first line of text hiding it.
Note: This displays correctly in IE6
Change History (3)
comment:1 Changed 12 years ago by
comment:2 Changed 12 years ago by
Milestone: | tbd → 1.3 |
---|---|
Owner: | changed from liucougar to bill |
Status: | new → assigned |
You are right, removing that border solves the problem... although I don't think it's the fault of the bordeer so much as the fact that, when used in conjunction with InlineEditBox, the Editor's domNode is a <span> rather than a <div>.
InlineEditBox's template (technically, InlineEditor?'s template) has a:
<span dojoAttachPoint="editorPlaceholder"></span>
which is then used to instantiate the editor:
var ew = this.editWidget = new cls(this.editorParams, this.editorPlaceholder);
And then Editor reuses that <span> node, for better or worse.
Anyway, I can work around this problem by making the <span> node display:block.
comment:3 Changed 12 years ago by
Resolution: | → fixed |
---|---|
Status: | assigned → closed |
(In [16639]) Fix display glitch on Editor inside of InlineEditBox?. Problem was that we were specifying a border on (an inline non display:block) <span>.
Fixes #8404 !strict.
Upon inspection in firebug it appears as though the .RichTextEditable? class's border-style property is to blame.
Doing this in a subsequent CSS file is a decent workaround for the issue:
body .RichTextEditable? { border: none; }