bootstrap按鈕在同一行 - 一個在一個元素，一個在一個表格

Question

我有2個按鈕，我希望他們在同一行。

按鈕來一個低於另外因爲一個是<a>元素裏面，一個是內部的form

下面是代碼

<a href="update/"><button class="btn btn-default">Update Contact</button></a> 
<form action="" method="post"> 
{% csrf_token %} 
    <button type="submit" class="btn btn-default">Delete Contact</button> 
</form> 

我怎樣才能讓他們在同一行？

小提琴 - http://www.bootply.com/114827

Answer 1

上的按鈕只需使用float:left;

的CSS：

button {float:left;} 

DEMO

Answer 2

這很容易，你只需要浮他們或把他們當成inline或內聯塊，或包含它們的任何元素（這將是清潔劑）：

http://www.bootply.com/114841

在這種特定的情況下：

a, form{ 
    float: left; 
} 

或

a, form{ 
    display: inline-block; 
} 

閱讀關於這裏的區別：https://stackoverflow.com/a/11823622/463065

Answer 3

使用 「內聯」 CSS類：

HTML：

<a href="update/"> 
    <button class="btn btn-default">Update Contact</button> 
</a> 
<form action="" method="post" class="inline"> 
    <button type="submit" class="btn btn-default">Delete Contact</button> 
</form> 

CSS：

.inline { 
    display: inline-block; 
} 

實施例：
http://www.bootply.com/114837