Internet explorer div contentEditable prevent DOM element selection onclick

I'm trying to update the innerHTML of a <div contentEditable=true> programmaticaly (javascript).

Using Internet Explorer < 8 or in Quirks mode if the HTML contains <span> tags one cannot not click to set the caret position, or navigate from char to char using keyboard. Instead the <span> is selected (oncli开发者_如何学Pythonck) and can be moved/resized, or the caret jumps to the beginning/end of the <span> (keyboard arrows).

Screenshot:

http://i54.tinypic.com/343p75y.png

Do you know how to prevent this kind of selection? Note that with Internet Explorer 8 in standard mode (or any other browser) I don't have this behavior.

This happens with any element that has layout. Make sure that none of the CSS properties that trigger layout are applied to your span and the problem will go away.