水平顯示跨度文本和輸入

Question

我希望這兩個元素內聯顯示。

下面是代碼：

<span class="login">Login <i class="icon-user"></i></span> 

<form action="#" class="search"> 
    <input type="search" class="search-input"/> 
</form> 

http://jsfiddle.net/wkprG/

感謝。

Answer 1

把跨度表單內

<form action="#" class="search"> 
    <span class="login">Login <i class="icon-user"></i></span> 
    <input type="search" class="search-input"/> 
</form> 

http://jsfiddle.net/wkprG/2/

Answer 2

你需要添加float:left;到登錄類：

.login{ 
    float: left; 
} 

這裏的jsFiddle

Answer 3

你可以用幾種方法解決它。其中之一是

.login, form.search{ 
    display:inline 
} 

http://jsfiddle.net/wkprG/6/