Tutorial: Comment box styling



haiii haiiiiii~ i'm back with my tutorial again *aseek
ini tutorial request dari maya, sebelum di mulai, aku tahu ini dari wanaseoby, jadi
cr tutorial : wanaseoby

  •  Dashboard->Template
  • cari kode .post{
  • paste code ini diatas code .post{
.comment-content{
background:#FFE2E2;
padding:13px;
border-radius:30px;
color:#666;}
h4{
background:#D1F4FE;
text-align:center;
color:#fff;
text-shadow:2px 2px 3px #888;
font:30px ttn !important;}


@font-face{
font-family:ttn;
src:url(http://static.tumblr.com/dep4vzc/82Km8jmz4/tutano_cc_v2.ttf);
}

.comment-block{background:#FEF3F3;
padding:10px;
border-radius:30px;
border:3px dashed #FEE8E8}

.avatar-image-container{background:#FFE2E2;padding:5px;border-radius:50%;}


.avatar-image-container img{
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;
border-radius:50%;}

.avatar-image-container img:hover{
border-radius:50%;
transform: rotate(360deg) ;
-webkit-transform: rotate(360deg) ;
-moz-transform: rotate(360deg) ;
-o-transform: rotate(360deg) ;
-ms-transform: rotate(360deg) ;}


.datetime{
background:#fff;
padding:8px;
float:right;
border-radius:30px;
font:10px arial;
margin-top:10px;}

.secondary-text{
padding:8px;
background:#fff;
border-radius:30px;
float:right;
border:2px solid #FEE8E8;
}

  • ganti text, warna, bg, dll sesuai selera~~
  • preview & save

Comments

Post a Comment

Silahkan kalian komentar...
- Jika kalian ingin komentar tidak boleh mengandung kata-kata kasar, kebencian, dan SARA.
Jika aku menemukan itu langsungku spam ^_^
-jika kalian ingin copas salah satu artikel di blog ini, diwajibkan harus memakai cr (credit)
Terima kasih~

Popular Posts