JSFiddle - React, Tailwind, and code Playground

by kirito0709

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css">
<link rel="stylesheet" href="https://framesirus.ru/local/templates/framesi/css/k.css">
<div>
  <ul class="pl0">
    <li><a target="_blank" href="https://vk.com/clubframesi" style="color:#4a76a8;"><i class="fab fa-vk" aria-hidden="true"></i></a></li>
    <li><a target="_blank" href="https://www.youtube.com/user/FramesiRus" style="color:#f00;"><i class="fab fa-youtube" aria-hidden="true"></i></a></li>
    <li><a target="_blank" href="https://www.facebook.com/FramesiRussia/" style="color:#3b5998;"><i class="fab fa-facebook" aria-hidden="true"></i></a></li>
    <li><a target="_blank" href="https://itunes.apple.com/it/app/framesi-shake-the-color/id409837970?mt=8" style="color:#fff;"><i class="fab fa-apple" aria-hidden="true"></i></a></li>
    <li><a target="_blank" href="mailto:[email protected]" style="color:#7b7878;"><i class="far fa-envelope" aria-hidden="true"></i></a></li>
    <li><a target="_blank" href="https://www.instagram.com/framesirus/" style="color:#517fa4;"><i class="fab fa-instagram" aria-hidden="true"></i></a></li>
    <li><a target="_blank" href="https://ok.ru/group/54171746369536" style="color:#ee8208;"><i class="fab fa-odnoklassniki" aria-hidden="true"></i></a></li>
  </ul>
</div>

CSS

div.social_icons> ul>li{
  display:inline-block;
  list-style-type: none;
  width: 50px;
  height: 50px;
  margin: 0 3px;
}
div.social_icons>ul>li>a{
  background: #c4c4c3;
  border-radius: 50%;
  display:block;
  text-align:center;
  border-radius: 50%;
  width: 100%;
  height: 100%;
  text-align: center;
  padding: 6px 6px 7px 7px;
  font-size: 28px;
}