Just a little tip

Tagged


If you find yourself dealing with this Firefox bug, and are using the visibility property in your CSS, then stop it! If you move to using display instead you can avoid the bug.


For those not following, there is a bug in Firefox that prevents cursors and scroll bars from being painted when you have a div hidden on your page that overlaps another div that contains input items. So in my case I had a hidden drop down admin menu that overlapped a div that contained a form.



When you clicked into a text input field or a textarea you would not be given a blinky cursor, and you wouldn't get scroll bars when you needed them. Changing my CSS to use display:hidden and display:block fixed the problem.


One problem this solution presents is that we are not using the properties correctly, since we are not changing how the div in question is displayed, but the visibility of said div. Unfortunately one must sometimes throw semantics to the wind when one wants something to actually work.


Although the circumstances aren't the same, I'm not using iframes or overflow:auto, the same bug is still triggered. I am also not sure if changing the CSS property would fix the bug in the other situation, but I thought I would post this here for posterity.