06 dezembro 2011

Bordas arrendondadas



       
Hi Girls! Hoje vou ensinar a vocês a como deixar as bordas do blog arredondas,mais somente nos cantos externos,tipo aqui no blog. Então sem mais delongas vamos aos códigos:

  Se você usa as colunas do lado direito,use esse código referente a área da postagem :
-webkit-border-top-left-radius: 15px;
-webkit-border-bottom-left-radius: 15px;
-moz-border-radius-topleft: 15px;
-moz-border-radius-bottomleft: 15px;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;


  E se você usa as colunas no lado direito use seguinte código,referente a área da coluna:
-webkit-border-top-right-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-moz-border-radius-topright: 15px;
-moz-border-radius-bottomright: 15px;
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;


 Mas se você usa as colunas do lado esquerdo use o seguinte código referente a área da postagem:
-webkit-border-top-right-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-moz-border-radius-topright: 15px;
-moz-border-radius-bottomright: 15px;
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;

E para quem usa as colunas no lado esquerdo,use esse código referente a área das colunas :
-webkit-border-top-left-radius: 15px;
-webkit-border-bottom-left-radius: 15px;
-moz-border-radius-topleft: 15px;
-moz-border-radius-bottomleft: 15px;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;

                         modo de usar:

Para arredondar a área da postagem,vá no HTML do seu blog,dê Ctrl+f e procure por:
.main-inner .column-center-outer {
 E cole abaixo dele o código referente a área das postagens.

Para arredondar a área das colunas do lado direito procure por:

.main-inner .fauxcolumn-right-outer .fauxcolumn-inner {

                             Para arredondar a área das colunas do lado esquerdo procure por:

.main-inner .fauxcolumn-left-outer .fauxcolumn-inner {

E cole abaixo dele o código referente a área das colunas.

Depois de ter feito as alterações,VISUALIZE  para ver se esta tudo certo!
Se deu alguma coisa errada me avise que resolverei o problema!

OBS: Eu que fiz os códigos se repassar por favor deixe os devidos créditos! 

            Então,por hoje é só. Bjs

11 comentários:

Anna Caroline K. disse...

é super simples né? hahaha!




Aproveitando a oportunidade, queria te mostrar a campanha que tá rolando lá no meu blog: Você comenta em um post e concorre a prêmios, porém pra ganhar mais pontos você pode ir comentando em posts antigos. Legal né? + infos.
http://bit.ly/v4lXK1

Beijos, te espero lá!
Acesse: It crazy, it fashion!

Italo Augusto disse...

Que layout lindo! Dexou o meu no chinelo! bquadrada.tk

Juliana Borges disse...

fica tão fofo a bordinha assim *-* vou fazer no meu proximo lay
ahh aceito parceria sim, vou te linkar
bjs
http://s2juuh.blogspot.com/

Italo Augusto disse...

Se eu te seguir você me segue? Desculpa a pergunta é porque tem muita gente que não retribui! Bjos!

bquadrada.tk

jackie Zanini disse...

Nossa que ótimo esse tutu heein Guria! *-*
Nossa Seu blog tá mtu fofo em clima de natal (:

Beeeeijos

Monique Santos disse...

Oii,adorei seu blog,ele é lindo,estou seguindo retribui??

beijookas

http://teen-dream-td.blogspot.com/

Monique Santos disse...

Muito obg ;)

Italo Augusto disse...

Já to te seguindo certo? Tem post novo no meu blog, ta super curioso. Conto com você la! bquadrada.tk

Maria Lua disse...

Amei o tutorial
Tá Rolando um Sorteio no blog Perfeita Teen de um anel “Bigodinho” (mustache!), Participa? http://bit.ly/s9TkcI beijão, http://perfeitateen.blogspot.com/ :*

Débora disse...

Lindo seu blog!
seguindo, segue de volta?
www.this-is-everything-blog.blogspot.com

Dayane Nascimento disse...

Adorei o tutorial ♥
visita?
Conversando com a lua