Image Replacement em elementos input
Leia em menos de um minuto
Neste post, expliquei como eu estava querendo aplicar um fundo a elemento button. Eu e o Rapha aqui do UOL descobrimos ontem uma maneira de fazer isso no elemento input.
Olha que fácil. No markup:
<input type="button" value="Um botão" />E o CSS:
input {
border: none;
background: url(https://s3.amazonaws.com/nandovieira/media/document-save-as.png) no-repeat;
content: ""; /* opera */
display: inline-block; /* opera */
height: 32px;
line-height: 0; /* ie */
text-indent: -9999px;
width: 32px;
}O melhor de tudo é que funciona até no Opera, coisa que não tinha conseguido fazer antes! ;)
Veja o resultado nos navegadores IE6 Standalone, IE7, Firefox 2 e Opera 9:
