對齊HTML元素horizo​​ntaly

Question

如何將這些元素排列在彼此旁邊而不是彼此之下？

---

<form action="http://xx.xxx.com/checker.php" method="post"> 
<input type="hidden" name="tokenz" value="9oaisdkjasiduqasdkjiwue" /> 
<input type="hidden" name="directz" value="true" /> 
Domain: <input type="text" name="domain" size="20" /> <select name="ext"> 
<option>.com</option> 
<option>.org</option> 
<option>.net</option> 
<option>.biz</option> 
<option>.info</option> 
<option>.us</option> 
<option>.pw</option> 
<option>.in</option> 
<option>.name</option> 
<option>.mobi</option> 
<option>.asia</option> 
</select> 
<input type="submit" value="Go" /> 
</form> 

---

非常感謝

Answer 1

下面是一個例子，如果這是你換貨什麼：

的jsfiddle：

http://jsfiddle.net/fhbha/

HTML：

<ul id="reg-lists" > 
    <li class="one"> 
     <select><option>Yes</option></select> 
     </li> 
    <li class="two"> 
      <select><option>Yes</option></select> 
     </li> 
    <li class="three"> 
      <select><option>Yes</option></select> 
     </li> 
    </ul> 

CSS：

li { 
    display:inline !important; 
    list-style-type: none; 
    padding-right: 10px;  
} 

Answer 2

形式只包含內聯元素。這意味着他們將保持在同一行，直到他們包裝。

如果您想防止包裝，請嘗試white-space: nowrap並給容器一個寬度。

小提琴

http://jsfiddle.net/Ballcheck/XbzdK/

HTML

<form action="http://xx.xxx.com/checker.php" method="post"> 
<input type="hidden" name="tokenz" value="9oaisdkjasiduqasdkjiwue" /> 
<input type="hidden" name="directz" value="true" /> 
Domain: <input type="text" name="domain" size="20" /> <select name="ext"> 
<option>.com</option> 
<option>.org</option> 
<option>.net</option> 
<option>.biz</option> 
<option>.info</option> 
<option>.us</option> 
<option>.pw</option> 
<option>.in</option> 
<option>.name</option> 
<option>.mobi</option> 
<option>.asia</option> 
</select> 
<input type="submit" value="Go" /> 
</form> 

CSS

form { 
    white-space: nowrap; 
    border: 1px solid red; 
    width: 200px; 
}