Cambiar apariencia de caja de texto

[Burasu]

Hola amigos, he de decir que he buscado en primer lugar en el foro por si existiera alguna solucion a mi duda, pero realmente no he encontrado ninguna.

Vereis, deseo cambiar en el formulario la caja de texto. Para ello he hecho una imagen y la quiero plasmar como caja de texto.

El codigo que he incluido en el css es el siguiente:

Código:

input {background: transparent url("../images/bg_input.gif") no-repeat; color: #000}

bueno la imagen aparece, en eso estoy conforme, pero existen cosas que no me funciona bien. Por ejemplo si selecciono el texto que he introducido no aparece resaltado. Si quito el transparent si funciona, pero se ve de fondo la caja de texto original. Otra cosa que ocurre es que si lo visiono en IE y empiezo a escribir se ve como la imagen empieza a moverse tambien. Es decir si la caja solo muestra 20 caracteres e introduzco 30 pues a partir del caracter 21 se ve como tambien se mueve el grafico correspondiente a la caja de texto.

Alguien me podria explicar como seria el modo correcto??

Gracias de antemano.

[emiliodeg]

input {background: transparent url("../images/bg_input.gif") no-repeat left top; color: #000}

proba con ponerle una posicion al fondo
ademas estaria bueno si en vez de trasparent utilizas un color por ejemplo #FFF (blanco) o uno q tenga q ver con el fondo

saludos

[Burasu]

Ok Emiliodeg haré eso que me comentas. Muchas gracias.

[Burasu]

Hola amigos, he probado lo que me comentaste emiliodeg, pero el problema de que la imagen que yo he creado para la caja de texto se desplace me sigue ocurriendo.

He puesto un ejemplo aqui para que veas lo que ocurre en IE, y sin embargo no ocurre en Firefox. Quizas mi error venga por otro lado.

[emiliodeg]

proba con esto
input {background: transparent url("../images/bg_input.gif") no-repeat center top; color: #000}


y sino create una imagen mas larga