Disappearing Cursor on Textbox

I encountered this problem in both IE and Firefox. When you tab to a certain textbox, the cursor does not appear (does not blink of course).

It works everything fine when the textbox was left-aligned. But since they were numeric fields, I need to right-align them, only to notice that the cursor disappears everytime focus is set to it, either view mouse or via keyboard tab.

The cursor appears however, if the textbox has value on it. I found an this article: http://blog.tremend.ro/2007/01/22/mouse-cursor-disappears-in-firefox/

It says that I need to set the container’s overflow to hidden in CSS:

.b-col {
/* other styles here */

overflow: hidden;

}

Wow, it works well in Firefox!

However, when I tests it on IE, it still disappears. After few minutes of knocking my head I came up with this solution. Since the cursor passed the overall width of the textbox making it invisible, we will make the overflow of the textbox to visible.

.num {
text-align: right;
overflow: visible;
}

It works in firefox! But once again, the dominating IE didn’t.
Another trick? Add right padding to the input element.

.num {
text-align: right;
overflow: visible;
padding-right: 2px;
}