This did not work. It did give me a different result. Anyway, maybe it would help if I displayed my entire code: index.html: <body> <div class="footer-social-icons"> <ul class="social-icons"> <li><a href="" class="social-icon"> <i class="fab fa-facebook-f"></i></a></li> <li><a href="" class="social-icon"> <i class="fas fa-phone-alt"></i></a></li> <li><a href="" class="social-icon"> <i class="fas fa-envelope"></i></a></li> <li><a href="" class="social-icon"> <i class="fas fa-map-marker-alt"></i></a></li> </ul> </div> </body> Style.css body { font-family: 'Lato', sans-serif; color: #FFF; align-items: center; justify-content: center; } a { text-decoration: none; color: #fff; } ul { padding:0; list-style: none; } .footer-social-icons { width: 100%; background: black; margin: 0 auto; } .social-icon { color: #fff; } ul.social-icons { margin-top: 10px; } .social-icons li { vertical-align: top; display: inline; height: 50px; } .social-icons a { color: #fff; text-decoration: none; } .fa-facebook-f { margin: 40px 40px; padding:20px 25px; -o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s; -webkit-transition:.5s; font-size: 20px; transition: .5s; border-radius: 50%; background-color: #027F01; } .fa-facebook-f:hover { transform: scale(1.2,1.2); } .fa-phone-alt { margin: 40px 40px; padding:20px 21px; -o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s; -webkit-transition:.5s; font-size: 20px; transition: .5s; border-radius: 100%; background-color: #027F01; } .fa-phone-alt:hover { transform: scale(1.2,1.2); } .fa-envelope { margin: 40px 40px; padding:20px 21px; -o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s; -webkit-transition:.5s; font-size: 20px; transition: .5s; border-radius: 50%; background-color: #027F01; } .fa-envelope:hover { transform: scale(1.2,1.2); } .fa-map-marker-alt { margin: 40px 40px; padding:20px 24px; -o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s; -webkit-transition:.5s; font-size: 20px; transition: .5s; border-radius: 50%; background-color: #027F01; } .fa-map-marker-alt:hover { transform: scale(1.2,1.2); }
... View more