I have a table with options at the end like View, Edit, and Delete. I need the Delete button to be inside a form so that I can POST the delete request.
However, my button/form is not aligning on the same line as expected. I have tried using the form-inline class and setting display inline-block, but nothing seems to work for me. I am using Bootstrap 3.2.
http://codepen.io/anon/pen/ojuLe
HTML
<table>
<tr>
<td>Something</td>
<td>
<a class="btn btn-default" href="/foo/1">View</a>
<a class="btn btn-primary" href="/foo/1/edit">Edit</a>
<form class="form-inline" method="POST" action="/foo/1">
<button class="btn btn-danger">Delete</button>
</form>
</td>
</tr>
<tr>
<td>Something else</td>
<td>
<a class="btn btn-primary" href="/foo/2/edit">Edit</a>
<form class="form-inline" method="POST" action="/foo/2">
<button class="btn btn-danger">Delete</button>
</form>
</td>
</tr>
</table>
CSS
td {
padding: 10px;
border-bottom: 1px solid green;
}