Un pequeño truco visto en DhtmlGoodies (por cierto, apuntaos este sitio si no lo conociais pues si sois diseñadores web vais a encontrar de todo). La idea es usar hojas de estilo CSS para colocar una imagen de fondo en el input text y mejorar la apariencia del mismo. Con algo muy sencillo, se consigue un resultado espectacular. Estas cosas son las buenas.
Aqui un ejemplo:
<STYLE>
.searchBox
{
background-image:url('./magnifying-glass.gif');
background-repeat:no-repeat;
padding-left:25px;
border-width:1px;
border-style:solid;
border-color:#CC00AA;
}
.userBox
{
background-image:url('users.gif');
background-repeat:no-repeat;
padding-left:25px;
border-width:1px;
border-style:solid;
border-color:#CC0000;
}
TD
{
font-size:12px;
}
</STYLE>
<TABLE>
<TR>
<TD><input type="text" name="buscar" class="searchBox" size="18"></TD><TD>(Buscar)</TD>
</TR>
<TR>
<TD><input type="text" name="nombre" class="userBox" size="18"></TD><TD>(Tipo)</TD>
</TR>
</TABLE>
Relacionado | Text input con imagen de fondo




Que buen tip, lo apunto en serio. Saludos amigo!
tu página no se me ve bien en tu navegador, esta caja de texto se ve cortada a la derecha por la sidebar. Mi resolución es de 1280×800 usando firefox 3.04. Saludos.
@Er@$$$Mo
pues no se, yo estoy visualizando bien el blog.
mi resolucion es: 1440 x 900 y uso Firefox 3.0.4 tambien.
Hola pues me has salvado era justo lo que andaba buscando