Navigation:
1. Login to the blogger.com
2. Click on Theme >> Edit Html
3. Click on Code & Click Ctrl +F & type ]]></b:skin> in search box. now press enter.
4. The cursor moves to that code position.
5. Now copy & past the following code before this code ]]></b:skin>
CSS Code:
"
#PopularPosts1 {max-width: 350px}
#PopularPosts1 dd {float: left; border-bottom: none; margin: 8px 8px 0 8px; background: none; display: block; padding: 0;}
#PopularPosts1 img {-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; padding: 4px; background: #eee; background: -webkit-gradient(linear, left top, left bottom, from(#eee), color-stop(0.5, #ddd), color-stop(0.5, #c0c0c0), to(#aaa)); background: -moz-linear-gradient(top, #eee, #ddd 50%, #c0c0c0 50%, #aaa); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 0 3px rgba(0,0,0,.7); -moz-box-shadow: 0 0 3px rgba(0,0,0,.7); box-shadow: 0 0 3px rgba(0,0,0,.7);}
#PopularPosts1 img:hover { -moz-transform: scale(1.2); -webkit-transform: scale(1.2); -o-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); -webkit-box-shadow: 0 0 20px rgba(238,132,84,.8), inset 0 0 20px rgba(255,255,255,1); -moz-box-shadow: 0 0 20px rgba(238,132,84,.8), inset 0 0 20px rgba(255,255,255,1); box-shadow: 0 0 20px rgba(238,132,84,.8), inset 0 0 20px rgba(255,255,255,1);}
.popular-posts ul{padding-left:0px;}
.popular-posts ul li {
background: #FFF no-repeat scroll 5px 10px;
list-style-type: none;
margin:0 0 5px 0px;
padding:5px 5px 5px 20px !important;
border: 1px solid #ddd;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
.popular-posts ul
li:hover {
border:1px solid #d2ac67;
}
.popular-posts ul
li a:hover {
text-decoration:none;
}
"
***
No comments:
Post a Comment