Coloque um ícone dentro do elemento de entrada em um formulário

O site que você ligou usa uma combinação de truques de CSS para conseguir isso. Primeiro, ele utiliza uma imagem de fundo para o elemento <input>. Depois, para empurrar o cursor para cima, ele utiliza `padding-esquerda'.

Em outras palavras, eles têm essas duas regras do CSS:

background: url(images/comment-author.gif) no-repeat scroll 7px 7px;
padding-left:30px;

Podes tentar isto:

input[type='text'] {
    fundo-imagem: url(images/comment-author.gif);
    posição de fundo: 7px 7px;
    fundo-repetição: não-repetição;
}

Basta usar a propriedade de fundo no seu CSS.

<input id="foo" type="text" />

#foo
{
    background: url(/img/foo.png);
}