Já ouviram Here's To Never Growing Up da Avril Lavigne? É perfeita, véi. É aquele tipo de música que te trás boas vibrações e não é aquele pop "forte" que a Avril costuma cantar (tipo, What The Hell e Girlfriend). Se ainda não ouviu, clique aqui.
~ Hey!
Não sabem a saudade que eu senti do blog, gente. Para quem não viu, eu deixei o blog fechado por quase quatro dias porque eu percebi que a minha sidebar não estava funcionando, as tags, os followers e os extras estavam só de enfeite, nada tava funcionando. Aí eu percebi que eram os gadgets do cabeçalho e aí eu fui testando vários códigos que não deram certo aí eu tive que fazer meu próprio código para colocar os gadgets em cima.
Bem, eu poderia ter terminado no primeiro dia em que fechei, mas eu estou viciada em um dorama (é tipo uma série) coreano, se chama To The Beautiful You e é perfeita. De 24 horas, 23h 58min eram para assistir o dorama e 2min era para concertar o blog, me desculpem.
Eu vou calar a boca e ir ao que interessa: o tutorial. Aqui o live preview. Já sabem o que fazer, né?
.main-inner h2.date-header {
float: left;
width:62px;/* largura */
height:65px;/* altura */
overflow:hidden;
font-size: 15px;/* tamanho da fonte */
color: #fff !important;/* cor da fonte */
text-align:center;/* alinha o texto */
margin-bottom: -65px; /* desce */
margin-left: -68px; /* margem para esquerda */
padding: 8px 2px 0px 2px; /* espaço interno: topo, direita, embaixo, esquerda */
-webkit-transition-duration: .80s;
outline-offset: -3px;
outline: 1px dotted #fff;
background: #COR;
box-shadow: inset 0 0 30px #SOMBRA, 0 0 4px #ccc;
}
.main-inner h2.date-header:hover {
background: #COR HOVER;
box-shadow: inset 0 0 25px #SOMBRA HOVER, 0 0 4px #ccc;
border-radius:0px;
-webkit-transition-duration: .80s;
}
float: left; é a flutuação. Se seus posts ficarem na direita, coloque right mas se ficar na esquerda mantenha o left
margin-left: -68px; se você colocou float: left; deixe assim, mas se colocou float: right; coloque right em vez de left . Mude o número para colocar para a direita ou esquerda.
Visualize e veja se está tudo bem, e depois salve
Bem, é só isso por hoje, LBStars! De novo, desculpa por ter deixado o blog fechado por esses dias.
Ah, em breve vou começar a postar em outro blog {surpresa, por enquanto} e eu não sei porque estou falando isso, acho que é porque estou bem animada. Tipo, o blog é super diwo!
Besos ;♥
Faz tempo que não vinha aqui,o layout está lindo e adorei o tuto,a data personalizando é bem fofinha.
ResponderExcluirBeijos
Amora R.
É difícil quando a gente vicia em alguma cvoisa, principalmente em séries, no meu caso são animes, tem dias que eu fico escrevendo o post é vendo eles, pois gosto muito deles.
ResponderExcluirQuando meu HTMl, dá defeito eu fico com uma mega raiva, mais não gosto de fechá-lo pois os novatos, podem acabar sumindo.
Sobre o estilo de data ele é muito perfeito, se meu layout não fosse tudo combinando eu o usaria, mais acho que vai ficar para a próxima, kisus.
Kuusou World
O lay ta tão lindo amor , e esse tuto amei :)
ResponderExcluirhttp://srta-kawaii.blogspot.com.br/
O layout está lindo, adorei o tutorial!
ResponderExcluirBeijos :3
pqngarota.tk
Amei esse modelo de data ^^
ResponderExcluirMeu Mundo, Meu Estilo
Que blog lindo agora sou leitora e fã rss'
ResponderExcluirBeeijos =3 http://princesses-ana.blogspot.com.br/
Não me encheu os olhos, porque nem tenho data em meus posts, mas pra quem curte, ficou legal!
ResponderExcluir@esteffanifontes, do blog Aos Dezesseis Anos
aosdezesseisanos.blogspot.com.br
amei o tutorial,eu estava procurando e nunca achava um fácil de fazeer.obrigada.Sobre o tuto do photoshop se vc ainda puder fazer;
ResponderExcluireu procurei como vc me explicou na ask,mas não achei.obrigada desde já.bjs:>
Sckitty World
Adorei o tuto, estou usando no meu novo Layout :D
ResponderExcluirFica muito fofinho a data *-*
ResponderExcluirameiii!
minhas-confissoes-2012.blogspot.com
Amei,eu estava mesmo precisando desse tutorial,eu coloquei no meu novo layout ok?Beijos
ResponderExcluirOlá, tentei colocar a data desta forma num blog, mas ela cortou na metade. Não está ficando em cima do post. O que faço?
ResponderExcluirAmei, usei em um layout ;)
ResponderExcluirolá não encontrei no meu layout do blogger todos os layout tem
ResponderExcluirGracias, fico muito kawaii \o/
ResponderExcluirNo meu blog nao to achando esse codigo
ResponderExcluirÉ exclusivo e FURADO!!!! a tag .main-inner h2.date-header { não existe e pra se localizar uma determinada tag em HTML é: CTRL+F não F3.
ResponderExcluirPela amor de Deus! Ctrl+F e F3 tem a mesma função: procurar palavras. Pelo menos no meu comutador tem.
ExcluirE sim, essa tag existe no template viagem, o mais usado como base. E está dentro de Headings.
Então, a não ser que use o modelo viagem como base esse tutorial realmente não vai funcionar....
Excluir