Bootstrap 3 | How to leave last column always more right?

Navigation
1

I need to leave the last column of my table (which has the glyphs of action) always more to the right: 

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script><linkhref="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><tableclass="table table-hover">
  <thead>
    <tr>
      <td class="col-md-1"></td>
      <td>Name</td>
      <td>Age</td>
      <td>E-mail</td>
      <td>Actions</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <input type="checkbox">
      </td>
      <td>John Doe</td>
      <td>50</td>
      <td>[email protected]</td>
      <td>
        <div role="toolbar" class="btn-toolbar">
          <div role="group" class="btn-group">
            <button type="button" alt="Delete record" class="btn btn-default"><span class="glyphicon glyphicon-remove-sign"></span>
            </button>
          </div>
          <div role="group" class="btn-group">
            <button type="button" alt="Edit record" class="btn btn-default"><span class="glyphicon glyphicon-edit"></span>
            </button>
            <button type="button" alt="Move record up" class="btn btn-default"><span class="glyphicon glyphicon-arrow-up"></span>
            </button>
            <button type="button" alt="Move record down" class="btn btn-default"><span class="glyphicon glyphicon-arrow-down"></span>
            </button>
          </div>
        </div>
      </td>
    </tr>
  </tbody>
</table>

Can you do this?

    
asked by anonymous 29.08.2015 / 21:55

1 answer

1

As mentioned in the comment, just put a pull-right , but not in the column, but in the div that will have the button bar, like this example: 

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<table class="table table-hover">
  <thead>
    <tr>
      <td class="col-md-1"></td>
      <td>Name</td>
      <td>Age</td>
      <td>E-mail</td>
      <td><span class="pull-right">Actions</span></td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <input type="checkbox">
      </td>
      <td>John Doe</td>
      <td>50</td>
      <td>[email protected]</td>
      <td>
        <div role="toolbar" class="btn-toolbar pull-right">
          <div role="group" class="btn-group">
            <button type="button" alt="Delete record" class="btn btn-default"><span class="glyphicon glyphicon-remove-sign"></span>
            </button>
          </div>
          <div role="group" class="btn-group">
            <button type="button" alt="Edit record" class="btn btn-default"><span class="glyphicon glyphicon-edit"></span>
            </button>
            <button type="button" alt="Move record up" class="btn btn-default"><span class="glyphicon glyphicon-arrow-up"></span>
            </button>
            <button type="button" alt="Move record down" class="btn btn-default"><span class="glyphicon glyphicon-arrow-down"></span>
            </button>
          </div>
        </div>
      </td>
    </tr>
  </tbody>
</table>
    
29.08.2015 / 23:59
Error caused by line break in append How to transform an array of char into UTF-8?