MAKE AMAZING BUTTONS WITH CSS ANIMATION Posted by Yahya Benlachheb on August 31, 2017 Get link Facebook Twitter Pinterest Email Other Apps HTML CODE <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css"> <title>CSS</title> </head> <body> <div class="a1"> <a href="#"></a> </div> </body> </html> CSS CODE body{ margin: 0; padding: 0; font-family: 'Ionicons'; } .a1{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } .a1 a{ width: 70px; height: 70px; display: block; color: white; background: black; overflow: hidden; text-align: center; text-decoration: none; font-size: 40px; border-radius: 50%; } .a1 a:before{ content: '\f2d3'; display: block; margin: 13px 0; transition: all 0.5s; } .a1 a:hover:before{ margin-top: -44px; } .a1 a:after{ content: '\f2d3'; display: block; transition: all 0.5s; } DOWNLOAD ALL FILES FROM HERE Comments Yahya BenlachhebSeptember 2, 2017 at 6:44 AMtest testReplyDeleteRepliesReplyAdd commentLoad more... Post a Comment
test test
ReplyDelete