Disappearing Cursor in Firefox

Written by Cory S.N. LaViska on May 7th, 2008

A quick fix for the disappearing cursor bug in Firefox.

Problem

The current version of Firefox (mine is 2.0.0.14) has a bug that makes the cursor in text fields and text areas disappear inside of divs in some cases. From the bug report:

Steps to Reproduce:
1. create a division with data and set style.overflow="auto" or "scroll"
2. create a second division with INPUT elements (type=text)on top(higher
z-index)
3. focus on the INPUT elements

Actual Results:  
cursor position is not visible

Expected Results:  
blinking cursor position in the INPUT element being focused

Workaround

One workaround I found that seems to do the trick is to add a child element (usually a div) with the style position: fixed. Alas, the trick involves an additional element of markup, but at least won't confuse your users.

Comments

Wow, haven't seen that before. Writing down the workaround in Snippely now...

#1 Spencer on May 7th, 2008

Thnaks Man! it worked like a charm!!!!

#2 Coder on Jun 17th, 2008

Try adding <div style="overflow-x:hidden"> to the div that contains the input fields. Simply using "overflow:hidden" does not work, it must be "overflow-x:hidden".

#3 Aftab on Nov 17th, 2008

Add a comment

Name*

Email*

Never, ever sold or spammed :)

Homepage

Comment*

Sorry, plain text only :(