CSS3 webkit desaparecendo em uma dica de ferramenta

Question

Eu acabei de experimentar com um CSS dica de ferramenta que se desvanece com CSS3 do transições.Eu estava indo para uma descrição do efeito que quando você passa o mouse em um link, aparece a descrição, mas desaparece em, utilizando apenas CSS3.

Eu tenho que trabalhar até um ponto, mas, por alguma razão, quando eu passe o mouse sobre para onde ele deveria estar, ele ativa, mesmo que ele initally posicionado left:-999px;.

Então, basicamente, o que estou fazendo de errado/é que eu estava indo para possível?(Nota: eu não quero fazer nada com JS/JQuery, estava apenas curioso para ver se eu poderia fazê-lo em CSS)

Você pode ver e jogar com ele aqui.

Answer 1

Sua span ainda está no document fluxo.

Você pode removê -lo definindo seu display para none, como o comentário acima sugere, ou definir seu position para absolute, o que parece ser o que você estava conseguindo para escondê -lo da borda esquerda da tela.

Answer 2

Você precisa definir a dica de ferramenta para o mesmo não ser apresentado normalmente.

#one a.tooltip span {
//display:block;
display:none; 
....
}

Editar:Parece que, ao invés de, em seguida, defina para exibir nenhum, apenas a posição absoluta.
Edit2:parece que eu estava batido para ele.