Letras se separando ao passar o mouse em cima

Olá amigas(os), quanto tempo! Hoje trago para vocês um tutorial muito fácil que vai deixar seu

blog mais fofo. Separar as letras dos títulos dos gadgets ou das postagens quando passa o 

mouse em cima.

Para separar os títulos dos gadgets:

.sidebar h2 {
TODO O SEU CÓDIGO DE FORMATAÇÃO AQUI
}
Antes de fechar a chave }, você coloca:

-webkit-transition-duration: .40s;

Ficando assim:

.sidebar h2{

TODO O SEU CÓDIGO DE FORMATAÇÃO AQUI

-webkit-transition-duration: .40s;

}

Para separar o título quando passar o mouse em cima:

Antes de fechar a chave }, você coloca:

 -webkit-transition-duration: .40s;
letter-spacing: 3px;

Ficando assim:

.sidebar h2:hover{

letter-spacing: 3px;

-webkit-transition-duration: .40s;

}

Para separar o título das postagens:

post h3{
TODO O SEU CÓDIGO DE FORMATAÇÃO AQUI
}
.post h3 a{

TODO O SEU CÓDIGO DE FORMATAÇÃO AQUI

}


Antes de fechar a chave }, você coloca:


-webkit-transition-duration: .40s;


ficando assim:

.post h3{ 

TODO O SEU CÓDIGO DE FORMATAÇÃO AQUI 

-webkit-transition-duration: .40s;

} .post h3 a{

TODO O SEU CÓDIGO DE FORMATAÇÃO AQUI

-webkit-transition-duration: .40s;

}

Para separar o título quando passar o mouse em cima:

Antes de fechar a chave }, você coloca:

 -webkit-transition-duration: .40s;
letter-spacing: 3px;

.post h3 a:hover{

letter-spacing: 3px;

-webkit-transition-duration: .40s;

}