Firefox

Question

I have a contentEditable div on which if a cursor is placed it's displayed as a huge cursor!

Here's the code:

<html>
    <head></head>
    <body >
        <div style="position:absolute; top:2px; left:30px; right:0px; bottom: 0px; height:100%;">
            <div contentEditable="true" style=" color:#333333; height:100%; width:100%; cursor:text;" spellcheck="false"></div>
        </div>
    </body>
</html>

You can see it here: http://jsfiddle.net/yW62h/

Here's what it looks like in my browser (FFX3.5) alt text

This problem also appears in FFX3.6 and 4.0b6

Is this a bug or am I doing something wrong here?

Tai · Accepted Answer

Not declaring 100% height and it works fine: http://jsfiddle.net/nS3X8/

Caret height is based on height in Firefox (which seems like a bug to me). Though it based on line-height in Webkit.

When setting the height of an input element use padding instead of height and Firefox will behave.

yper · Answer

Try adding a <br /> inside the editable div. That worked for me: http://jsfiddle.net/66A2h/

Firefox - Huge Cursor

Tags:

text-cursor

instantsetsuna

2 Answers

Tai

yper

Recent Activity

Donate For Us