CSS Komentar Blogger Seperti Komentar Google+

CSS Komentar Blogger Seperti Komentar Google+

CSS Komentar Blogger Seperti Komentar Google+ - Pasti kalian sudah pernah melihat/memakai komentar google plus kan? sekarang saya mau berbagi "CSS Komentar Blogger Seperti Komentar Google+" sepertinya css ini sangat menarik untuk digunakan dan yang pastinya CSS Komentar ini seperti Komentar Google+.
Cara pemakaiannya cukup mudah, hapus semua CSS Komentar Blogger yang anda pasang, lalu anda ganti dengan CSS Komentar ini
.comments{border:1px solid #ccc}
.comments .comment-block{margin-left:90px}
.comments .comments-content .user{    color:#262626;         font-style:normal;     font-weight:bold; font-size:13px; font-family:arial}
.comments .comment-replybox-thread{    margin-left:20px;     margin-top:5px}
.comments .comments-content .comment-content{    color:#262626;     font-family:arial; padding-right:25px; font-size:13px; text-align:left}
.comments .comments-content .comment{border-bottom:1px solid #EEE}
.comments .comments-content .comment-header, .comments .comments-content .comment-content{    margin:0}
.comments .comments-content .icon.blog-author{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiCnETU-VSJVm8g6akmBnzDj7lFge-iIewgO2RNjFozSWvXbRRIoLE-POmxwqOr5TvahWrZ3MbrW9NcTIDKhAgB8XWubdwQRV9qmek9r2KbPCn_3nGc5UF_3NgsyzTUiVNBGimV9WpBkk/s320/author.png) no-repeat;}
.comments .comments-content .datetime{    color:#999;     font-family:arial;     font-size:11px;     margin-left:6px}
.comments .comments-content .datetime a:link{color:#999}
.comments .comments-content .datetime a:visited{color:#999}
#comments h4{  background:none repeat scroll 0 0 #EEE;     color:#262626;     font-size:16px;     padding-bottom:25px;     padding-left:25px;     padding-top:25px; font-style:normal; font-family:arial}
#comments-block dt{  margin:.5em 0}
#comments-block dd{  margin:.25em 0 0}
#comments-block dd.comment-footer{  margin:-.25em 0 2em;   line-height:1.4em;   font-size:78%;     display:none}
#comments-block dd p{  margin:0 0 .75em}
.comment-form{clear:both;     margin-left:20px;     margin-top:-60px; width:550px}
.comments .avatar-image-container img{    max-width:50px}
.comments .avatar-image-container{    float:left;     max-height:50px;     overflow:hidden;     width:50px}
.avatar-image-container{    background:url("//ssl.gstatic.com/s2/profiles/images/silhouette46.png") repeat scroll 0 0 / 100% auto transparent;  border-radius:50px 50px 50px 50px; -moz-border-radius:50px 50px 50px 50px;  -webkit-border-radius:50px 50px 50px 50px;  color:#FFF;  display:block;  float:left;  font-size:20px;  height:50px;  margin-left:20px;  text-align:center;  width:50px}
.comments .avatar-image-container img{ width:50px}
#comments-block.avatar-comment-indent{ margin-left:4px;  position:relative}
ol #comments-block li{ border-bottom:1px solid #EEE;  list-style:none;  margin:20px 0;  z-index:-100; min-height:90px}
#comments-block .comment_content{ width:500px}
.deleted-comment{ font-style:italic;  color:gray}
nah, jika sudah anda terapkan, silahkan anda save.
ok cukup sampai sini dulu, karna dah malem, semoga artikel ini bermanfaat / berguna untuk anda.

Code by : TheMasDoyok

Postingan terkait:

10 Tanggapan untuk "CSS Komentar Blogger Seperti Komentar Google+"

  1. wah keren :3 ijin praktekin ya tapi ribet dah kayanya :v

    commentback ya dah tau kan blog gw? \:v/

    ReplyDelete
  2. hohoho keren, kalo ditambahin border disetiap komen pasti lebih keren :3

    ReplyDelete
    Replies
    1. itu ga ada htmlnya dan ?? mau coba takut salah :3

      Delete
    2. HTML ? itu kan CSS komentar, ya kalo lu pasang pasti langsung keubah sendiri, HTML komentar udah ada dari sononya kali.

      Delete
  3. Wawww spertinya keren nihhh gannn ..........
    tak coba dulu ye gann

    ReplyDelete

Catatan :
- Dilarang Menggunakan Link Aktif / Live Link
- Dilarang Promosi Iklan
- Dilarang Nyepam
- Untuk Menyisipkan Kode, Gunakan tag <i rel='code'> Taruh Kode Disini </i>
- Untuk Menyisipkan Kode Panjang, Gunakan tag <i rel='pre'> Taruh kode panjang disini </i>
- Untuk Menyisipkan Catatan, Gunakan <b rel='quote> Taruh Catatan disini </b>
- Untuk Menyisipkan Gambar, Gunakan <i rel="'image> URL Gambar </i>
- Untuk Menyisipkan Youtube, Gunakan <i rel='youtube'> URL Youtube </i>

Sebelum menyisipkan kode silahkan gunakan Tools Konversi Kode.
Caranya tinggal klik tombol "Konversi Kode" yang berada di Form Komentar.