Como separar os gadgets

Found here

Ooi gente! Recebi esses dias, se não me engano, um pedido desse tutorial para separar os gadgets do blog, e como eu não encontrei ele em nenhum blog (não lembro de onde peguei) peguei no meu HTML mesmo, então se eu tiver pego do seu blog, me avise. Procurei até no google algum tutorial assim, mas nenhum era como é o meu.

Enfim, vamos ao tutorial:

Vá no seu HTML, procure por /* Widgets e você achará algo mais ou menos assim:

.sidebar .widget {
  border-bottom: 2px solid $(widget.border.bevel.color);
  padding-bottom: 10px;
  margin: 10px 0;
}

Antes de fechar a chave, cole: background: #FFFFFF; 

Esse é o código do fundo, você pode trocar #FFFFFF por outra cor, use essa tabela para ver códigos de cores.

Se você quiser deixar a borda dos gadgets arredondada, além do código fornecido, cole antes de fechar as chaves:

-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;

Visualize, e se estiver tudo certinho, salve.

Agora você deve ter percebido que os seus gadgets estão com um fundo atrás, certo? Então agora vamos eliminar esse fundo.

Procure por:

.main-inner .fauxcolumn-right-outer .fauxcolumn-inner { (se sua sidebar for direita)

ou

.main-inner .fauxcolumn-left-outer .fauxcolumn-inner { (se sua sidebar for esquerda)

E você achará algo parecido com isso:

.main-inner .fauxcolumn-right-outer .fauxcolumn-inner {
  margin-left: $(content.padding);
  background: $(widget.outer.background.color) $(widget.outer.background.gradient) repeat scroll top left;
}

Agora substitua a área sublinhada:

$(widget.outer.background.color) $(widget.outer.background.gradient) repeat scroll top left;

Por transparent;

(não esqueça do ponto e vírgula)

Visualize, e se estiver transparente, e os gadgets bonitinhos da cor que você colocou, salve.

Espero ter ajudado, qualquer dúvida, podem perguntar que eu tentarei te ajudar conforme eu puder.

Se usarem esse tutorial, creditem o blog, e se quiserem, podem repassar. hoje estou boazinha

Beijos!