title: Bootstrap 3 vertically stacked social buttons
body: <p>I am trying to create this button in CSS/HTML:</p>
  
  <p><a href="https://i.stack.imgur.com/m6kDs.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/m6kDs.png" alt="enter image description here"></a></p>
  
  <p>Here is what I have:</p>
  
  <p><a href="https://i.stack.imgur.com/IYb4F.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/IYb4F.png" alt="enter image description here"></a></p>
  
  <p>Does anyone know how I can create this perfectly?</p>
  
  <p>Here is my code</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" /&gt;
  &lt;style&gt;
    .btn {
      padding: 14px 24px;
      border: 0 none;
      font-weight: 700;
      letter-spacing: 1px;
      text-transform: uppercase;
    }
    .btn:focus,
    .btn:active:focus {
      outline: 0 none;
    }
    .btn-primary {
      background: #d5e14d;
      color: #fff;
      border-radius: 0;
    }
    .btn-primary:hover {
      background: #d5e14d;
    }
  &lt;/style&gt;
  &lt;button class="btn btn-primary"&gt;&lt;i class="fa fa-instagram"&gt;&lt;/i&gt; Instagram&lt;/button&gt;</code></pre>
  </div>
  </div>
  </p>