Search code examples
richtextboxcontenteditablerichtextricheditrichtextediting

contentEditable cursor position/style in FireFox

I'm having trouble using contentEditable in FireFox 3. I have a problem where the cursor will appear above or only partially in the div after I click in it (until I start typing at which time it behaves correctly). Any ideas on how I can stop this from happening?

HTML:

<html>
  <head><title>Test Page</title></head>
  <body>
    <div id="editor" style="position:absolute; left:157px; top:230px; width:120px; height:30px">
      <div id="input" style="width:100%; height:100%; border:1px solid black; outline:none" contentEditable="true"> </div>
    </div>
  </body>
</html>

alt text

Solution

  • I waited and used the content editable only in Firefox 4 and higher. I filed this and a few other bugs which the Mozilla team has fixed for FF 4.