爲什麼我的CSS樣式輸入不會放在標籤旁邊？

我正在構建一個簡單的網絡表單，並且我的一個輸入字段根本不會按照假定的那樣着裝，而是坐在前一個表單字段的右側。我已經將我的表格縮減爲一個非常簡單的文本案例。爲什麼我的CSS樣式輸入不會放在標籤旁邊？

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>Test</title> 
    <style> 
    #new-thing { 
     width: 450px; 
    } 
    #new-thing label { 
     clear: left; 
     float: left; 
     width: 120px; 
     font-weight: bold; 
    } 
    #new-thing input { 
     width: 250px; 
     margin-bottom: .5em; 
    } 
    </style> 
</head> 
<body> 
<div id='new-thing'> 
    <form> 
    <label for='name'>Thing Name:</label> 
    <input id='name'> 
    <label for='first-thing'>First:</label> 
    <input id='first-thing' style='width:6em;'> 
    <label for='second-thing'>Second:</label> 
    <input id='second-thing' style='width:6em;'> 
    </form> 
</div> 
</body> 
</html>

第二字段假定第一下坐，鄰近所述標籤「第二：」，但它位於所述第一場的權代替。看到這樣的畫面捕捉：

enter image description here

有什麼我錯過了？

來源

2012-09-07 Dave Sag

因爲你沒有浮動你的輸入。

變化#new-thing input是：

#new-thing input { 
    float: left; 
    width: 250px; 
    margin-bottom: .5em; 
    }

See here

來源

2012-09-07 06:03:32

良好的漁獲物。即將發佈相同的東西。 – Wex

sla頭！非常感謝Erics。 –

-1

試試這個：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>Test</title> 
    <style> 
    #new-thing { 
     width: 450px; 
    } 
    #new-thing label { 
     clear: left; 
     float: left; 
     width: 120px; 
     font-weight: bold; 
    } 
    #new-thing input { 
     width: 250px; 
     margin-bottom: .5em; 
    } 
    </style> 
</head> 
<body> 
<div id='new-thing'> 
    <form> 
     <table> 
     <tr> 
      <td><label for='name'>Thing Name:</label></td> 
      <td><input id='name' /></td> 
     </tr> 

     <tr> 
      <td><label for='first-thing'>First:</label></td> 
      <td><input id='first-thing' style='width:6em;' /></td> 
     </tr> 

     <tr> 
      <td><label for='second-thing'>Second:</label></td> 
      <td><input id='second-thing' style='width:6em;' /></td> 
     </tr> 

     </table> 
    </form> 
</div> 
</body> 
</html>

來源

2012-09-07 06:10:36

爲什麼我的CSS樣式輸入不會放在標籤旁邊？

回答

相關問題