Firefox Invisible Caret - Position:fixed;
Tuesday, January 29th, 2008The amazing Firefox has a problem (in version2.0, it’s fixed for version3 here’s a bugzilla thread on it) . Under certain circumstances the caret/cursor (i.e. the little vertical line that blinks at you when you’re typing) vanishes! Doesn’t sound like a huge issue, but it’s potentially a massive problem that breaks the interface. If you can’t see where you’re typing you’ve got a serious problem.
For example, in the Woosabi product our integrated email and contact management uses a lightbox gone wild/subModal style window. When the user wants to read/reply/compose an email it overlays itself over the main page - like a traditional email client would. This metaphor works really well, not least because it looks like a little sheet of paper. However, it all breaks down when the user can’t see where they’re typing on Firefox 
After trawling many sites to solve it the common solution, most of which use the CSS setting overflow: auto I found that the root of the problem seems to be this this:
Textareas and text input fields that appear within an Iframe that appear within a div that has the CSS setting {position: fixed} will exhibit the problem. Still with me? Good, becuase if you change the position on the div to absolute the problem disappears.
It isn’t appropriate for all interfaces as it will affect your layout but it’s a consistant - I found that the overflow: auto suggestion did not work consitantly.
-Dan
