personal site

1) dashboard > template > editHTML
2) find this code

</style>

3)paste this code before </style>

pic1 {
margin: 3px;
width: 100px;
height: 100px;
overflow: hidden;
position: relative;
border: 3px solid #ffacfa;
float: left;
}
pic2 {
position: absolute;
display: block;
width: 300px;
height: 30px;
top: 30px;
margin-left: -20px;
opacity: 0;
text-align: center;
color: #bdbdbd;
background: #fff;
-webkit-transition-duration: 0.8s;
border-top: 3px solid #ffacfa;
border-bottom: 3px solid #ffacfa;
line-height: 4px; text-transform: uppercase ;
-webkit-transform: rotate(-30deg);
font-size: 15px;
font-family:arial;
}
pic1:hover pic2 {
left: 20px; top: 60px;
bottom: 5px; opacity: 1;
width: 103px; height: 20px;
line-height: 20px;
-webkit-transform: rotate(0deg)
}

4) paste this code after </style>

<a href="LINK"><pic1><img src="URL IMGE" width="150px" height="150" /> <pic2>NAME</pic2></pic1></a></div>

5) save.

Post a Comment