Modifikasi ke-2 Kotak Komentar Blog

Kawan masih ingat dengan Artikel saya tentang "Modifikasi Kotak Komentar mirip Thread Comments" yang hasilnya kurang lebih seperti Gambar berikut :D

Sekarang saya akan mencoba Memodikasi lagi biar kelihatan lebih jelas sebagai Admin dan Kotak Komentarnyapun terbalik dengan dulu, coba perhatikan gambar berikut dan khususnya tanda petunjuk yang berwarna putih garis merah

Caranya :

1. Masuk Account Blogger dengan ID kawan
2. Pada Perancang Template pilih Edit HTML
3. Cari Kode Css Comment yang scriptnya kurang lebih seperti berikut :

#comments{
clear:both;
float:left;
width:525px;
margin: 0;
padding:10px;
line-height:1.4em;
background: transparent;
}
#comments h4{
color:#FF0;
margin:0;
padding:7px 10px;
font-size:140%;
font-weight:normal;
line-height:1.3em;
background: #000;
}
#comments p.notice{
text-align:center;
font-weight:700;
margin:0 0 10px;
padding: 0;
}
.commentlist,.commentlist-destacado{
clear:both;
float:right;
width: 525px;
background: transparent;
list-style:none;
margin: 5px 0;
padding: 0;
}
.commentlist li,commentlist-destacado li{
clear:both;
float:right;
width:465px;
background: #95CAFF;
color: #00F;
font-size:12px;
margin:0 5px;
padding:0;
}
#comments .commentlist li.pingback div.comment-body,
#comments .commentlist li.trackback div.comment-body{
border-bottom:0px solid #F00;
}
#comments .commentlist li div.comment-author .avatar{
float:left;
width:40px;
height:40px;
border:5px solid #E0E4CC;
margin:0 10px 0 0;
padding:0;
}
cite.fn{
font-size:17px;
color:#6b6b6b;
font-style: normal;
font-weight:700;
font-style:bold;
}
.says{
margin-left:3px;
display:none;
}
.comment-meta{
margin-bottom:10px;
font-size:12px;
color:#00F;
}
.comment-meta a{
text-decoration:none;
color:#00F;
}
#comments .commentlist li p,
#comments .commentlist-destacado li p{
margin: 0 0 10px;
padding: 0;
}
.comment p{
display:block;
}
.comment-author{
color: #000;
font-size:12px;
margin:5px 0 0 0;
padding:0;
line-height:1.3em;
}
.avatar-image-container{
float:left;
width:40px;
height:40px;
border:0px solid #ccc;
margin-right:10px;
padding:1px;
}
.avatar-image-container img{
width:40px;
height:40px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3fw5RRyFsEp1j4pbEFODbqZUg7XEk-jlYYjlzjN2LlJsNiI19EV4dn3xyzcboMwF6K1eA73Tr_oVvAB4PP85MzX-sQvMwUOfIdfYfsQP1TUk41FVu3OYn7tjSFT_8nvnZ16w-Q31Uxjg/s1600/no-avatar.png);
}
.comment-form{
width:450px!important;
max-width:450px!important;
}
#comments .commentlist li div.comment-body,
#comments .commentlist-destacado li div.comment-body{
background: transparent;
margin:5px;
padding: 5px 10px;
border: 1px solid #95CAFF;
}
#comments .commentlist li div.comment-body,
#comments .commentlist-destacado li ;
}

Hapus semua script tersebut dan ganti dengan :

#comments{
clear:both;
float:left;
width:555px;
margin: 0;
padding:10px;
line-height:1.4em;
background: transparent;
background: -moz-linear-gradient(top,  rgb(99,147,193) 100%, rgb(207,231,250) 0%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(100%,rgb(99,147,193)), color-stop(0%,rgb(207,231,250)));
background: -webkit-linear-gradient(top,  rgb(99,147,193) 100%,rgb(207,231,250) 0%);
background: -o-linear-gradient(top,  rgb(99,147,193) 100%,rgb(207,231,250) 0%);
background: -ms-linear-gradient(top,  rgb(99,147,193) 100%,rgb(207,231,250) 0%);
background: linear-gradient(top,  rgb(99,147,193) 100%,rgb(207,231,250) 0%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6393c1', endColorstr='#cfe7fa',GradientType=0 );
}
#comments h4{
color:#FF0;
margin:0;
padding:7px 10px;
font-size:140%;
font-family: Arial Narrow;
font-weight:normal;
line-height:1.2em;
}
#comments p.notice{
text-align:center;
font-weight:700;
margin:0 0 10px;
padding: 0;
}
.commentlist,.commentlist-destacado{
clear:both;
float:right;
width: 485px;
background: #95CAFF;
list-style:none;
margin: 5px 0;
padding: 0;
}
.commentlist li,commentlist-destacado li{
clear:both;
float:right;
width:545px;
background: #D4E3EA;
color: #00F;
font-size:12px;
margin: 0;
padding:0 5px;
}
#comments .commentlist li.pingback div.comment-body,
#comments .commentlist li.trackback div.comment-body{
border-bottom:0px solid #F00;
}
#comments .commentlist li div.comment-author .avatar{
float:left;
width:40px;
height:40px;
border:5px solid #E0E4CC;
margin:0 10px 0 0;
padding:0;
}
cite.fn{
font-size:17px;
color:#6b6b6b;
font-style: normal;
font-weight:700;
font-style:bold;
}
.says{
margin-left:3px;
display: none;
}
.comment-meta{
margin-bottom:10px;
font-size:12px;
color:#00F;
}
.comment-meta a{
text-decoration:none;
color:#00F;
}
#comments .commentlist li p,
#comments .commentlist-destacado li p{
margin: 0 0 10px;
padding: 0;
}
.comment p{
display:block;
}
.comment-author{
color: #000;
font-size:12px;
margin:5px 0 0 0;
padding:0;
line-height:1.3em;
}
.avatar-image-container{
float:left;
width:40px;
height:40px;
border:0px solid #ccc;
margin-right:10px;
padding:1px;
}
.avatar-image-container img{
width:40px;
height:40px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3fw5RRyFsEp1j4pbEFODbqZUg7XEk-jlYYjlzjN2LlJsNiI19EV4dn3xyzcboMwF6K1eA73Tr_oVvAB4PP85MzX-sQvMwUOfIdfYfsQP1TUk41FVu3OYn7tjSFT_8nvnZ16w-Q31Uxjg/s1600/no-avatar.png);
}
.comment-form{
width:480px!important;
max-width:480px!important;
}
#comments .commentlist li div.comment-body,
#comments .commentlist-destacado li div.comment-body{
background: transparent;
margin:5px;
padding: 5px 10px;
border: 0px solid #95CAFF;
}
#comments .commentlist li div.comment-body,
#comments .commentlist-destacado li ;
}

• Simpan Template kawan 
• Saya ingatkan kawan bahwa modifikasi ini merupakan lanjutan modifikasi sebelumhnya 
• Lebar Kotak Komentar Blog kawan silahkan disesuaikan