Títulos dos gadgets "em caixas"

Cherries, quantos comentários! Estou tentando responder todos mais além dos comentários do blog tem vários e-mails com pedidos de layouts, ou seja estou super atarefada. Mas até acho isso bom, é sinal de que o blog está progredindo! Só que tem um lado ruim, meu tempo fica mais curto, então posso demorar um pouquinho para postar. Então se eu ficar uns dias sem postar não pensem que eu desisti de novo tá?

Agora chega de papo e vamos para o tutorial de hoje. Ele foi pedido já faz um tempo, mas resolvi postá-lo mesmo assim. Com este post vocês irão aprender a deixar os títulos dos gadgets em cima do gadget e com o fundo retangular, como se fosse uma caixinha. Não entendeu? Então veja como fica:

Aviso: Antes de fazer esse tutorial, você tem que separar os gadgets da sidebar. Veja como neste post.
Depois de terminar, vá no modelo HTML do seu blog, e cole o código abaixo antes de ]]></b:skin>

.sidebar .widget {
padding: 10px;
margin-bottom: 50px; /*Espaço entre um gadget e outro*/
}
.sidebar .widget h2 {
background: #000; /*Cor do fundo do título*/
width: 150px; /*Largura do fundo, aumente se precisar*/
font-family: Verdana; /*Fonte do titulo*/
font-size: 14px; /*Tamanho da fonte*/
font-weight: normal;
line-height: 14px; /*Altura da linha, coloque o mesmo que o tamanho da fonte*/
margin-top: -30px; /*Quantos pixels o título "sobe"*/
margin-left: -10px;
padding-left: 5px;
box-shadow: 1px -1px 2px #9a9a9a;
-webkit-box-shadow: 1px -1px 2px #9a9a9a;
-moz-box-shadow: 1px -1px 2px #9a9a9a;}

No próprio código tem as explicações do que alterar. Se quiser tirar a sombra é só apagar a parte que está em verde. Espero que funcione tudo certinho aí para vocês!

Cherries, eu e minha prima criamos uma página de frases e textos no face, se chama Apena Palavras, deem uma olhada lá e se gostarem, curtam! Obrigada :)

Kissus, Liah