title: Align buttons vertically
body: <p>I have this card here <a href="https://i.stack.imgur.com/AW5GO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/AW5GO.png" alt="enter image description here"></a> i want my buttons to show separately and vertically aligned too and also pulled right. How can i achieve that? Her eis the demo card <a href="https://i.stack.imgur.com/z4Nx3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/z4Nx3.png" alt="enter image description here"></a></p>
  
  <p>Here is my code</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/&gt;
     &lt;div class="body"&gt;
       &lt;div class="row clearfix"&gt;
        &lt;div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"&gt;
         &lt;div class="card main-content"&gt;
          &lt;div class="body"&gt;
           &lt;div class="row clearfix"&gt;
              &lt;div class="col-sm-12"&gt;
                  &lt;img id="studentimg" name="studentimg" alt="User Pic" src="/assets/images/student-avatar.png" align="left" width="150" height="150"&gt;
                  &lt;p&gt;{{studentDetail.firstName}}&amp;nbsp;{{studentDetail.lastName}}&lt;/p&gt;
                  &lt;span class="pull-right" style="display: inline-block"&gt;
                      &lt;button href="#" class="btn btn-primary pull-right" (click)="editStudent(studentDetail.studentKey)"&gt; &lt;span class="glyphicon glyphicon-pencil"&gt;&lt;/span&gt;Edit&lt;/button&gt;
                      &lt;button href="#" class="btn btn-danger pull-right"&gt;&lt;span class="glyphicon glyphicon-trash"&gt;&lt;/span&gt;Delete&lt;/button&gt;
                  &lt;/span&gt;
              &lt;/div&gt;
           &lt;/div&gt;
          &lt;/div&gt;
         &lt;/div&gt;
        &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <pre><code>&lt;/div&gt;
  </code></pre>