Estoy desarrollando mi primer sitio web HTML5 / CSS3 y quiero hacer todo lo que pueda correctamente y con buenos métodos y ser utilizable también.

Tengo que reproducir la siguiente entrada de búsqueda en este sitio web:

o que no sé hacer es implementar el fondo de la imagen, o si la imagen debe ser una<input type="image" />.

En este momento, lo que tengo es el siguiente:

#header-search input {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border:1px solid #8e8e8e;
    background-color:#f5f5f5;
    height:16px;
    padding:4px;
    color:#4a4a4a
}

Esto crea una entrada con el mismo radio y toda el área es texto de entrada. No hay espacio para la lupa y si se tratara de un fondo, no se puede hacer clic en la imagen. En este punto, ¿qué es lo mejor? Deje que la entrada solo se active o ... ¿cómo lo hará?

e todos modos lo harás, por favor dim

¡Gracias de antemano