Editing text in Visual editor does not work on IE

[wp_kc]

Tested with current versions of Google Chrome, Firefox, and IE versions 9 and 11 on Vista and Windows 7.

Setup:

• Latest version of WP
• IE v9 or v11 (have not tried other versions)
• Windows Vista or 7 (have not tried other versions)
• Open a page or post for editing in the View editor.
• Try to click on a paragraph of text to set the cursor for editing.

Results:

• On Chrome and Firefox works as expected, a cursor bar appears and text can be edited.
• On IE, a size box appears around the paragraph of text and the pointer changes to a nesw-resize icon. Text can not be edited.
• Text editing works as expected in the Text editor on all browsers tested.

[SergeyBiryukov]

Could not reproduce in IE11 on Windows 7. Visual editor works as expected for me.

[azaozz]

This is a "feature" in IE: in contenteditable if you add width to a block tag, it turns it into this... "special" area that is resizable and draggable, and editing it is hard. If there's no width, all works as expected. Check if your theme's editor-style.css adds width to all <p>.

[nacin]

Replying to azaozz:

This is a "feature" in IE: in contenteditable if you add width to a block tag, it turns it into this... "special" area that is resizable and draggable, and editing it is hard. If there's no width, all works as expected. Check if your theme's editor-style.css adds width to all <p>.

Is this not something we (or TinyMCE) can work around?

[azaozz]

This "special" mode in IE is quite hard to prevent. Happens also for images with captions, but since the caption text can be edited from the modal, it's not a big problem there. Was looking for ways to prevent it, unfortunately IE enforces it and none of the (old) tricks like canceling oncontrolselect and unselectable="on" seem to work.

The one thing we can do it set p { width: auto !important; } in the editor stilesheet but that may bring other incompatibilities with editor-style.css.