Clint McKoy

I’ve come across this issue a few times lately, where the value for a text input will not disappear in IE7 (Internet Explorer 7) by using text-indent alone. This becomes an issue when trying to implement a custom submit button that consists of a background image only.

The solution: Give the input a very high line-height and set the overflow to “hidden”. 

input {
	line-height: 500px;
	overflow:hidden; 
}

But unfortunately, this method does not work on FF (Firefox). You’ll still need to use the text-indent method as well. So, you’re finished product will look something like this:

input {
	text-indent: -9999px;
	line-height: 500px;
	overflow:hidden; 
}