如何獲得一組文本和列表框，以正確地垂直對齊，並保持均勻間距？

Question

我正在構建一個使用相當基本技術的網頁。我在網頁的某個部分有三行，每個部分的結構都是。不同行的文本單元和列表框單元處於完美的水平對齊方式，但列表框之間的垂直間距不一致。此外，每個列表框相對於其配對文本的垂直對齊是不同的。我嘗試過重新調整表格結構並嘗試使用valign，但無濟於事。我如何解決這個問題，使它看起來整潔？謝謝！

Answer 1

您可以通過CSS像

td { 
    height: 50px 
} 

設置每個TD的高度也應該檢查出如何設計形式的一些教程，而不使用表http://www.cssdrive.com/index.php/examples/exampleitem/tableless_forms/

Answer 2

<form> 
    <table border="0" width="100%" cellpadding="0"> 
     <tr> 
      <td> 
       <table border="0" width="100%" cellpadding="0"> 
       <tr> 
        <td align="right" width="50%"> 
         Please choose the test category: 
        </td> 
         <td align="left" width="50%"> 
          <form action=""> 
           <select name="categories" style="width:20%;"></select> 
          </form> 
         </td> 
        </tr> 
        </table> 
       </td> 
      </tr> 
     </table> 
     <br /> 
     <table border="0" width="100%" cellpadding="0"> 
      <tr> 
       <td> 
        <table border="0" width="100%" cellpadding="0"> 
        <tr> 
         <td align="right" width="50%" valign="center"> 
          Please choose the test: 
         </td> 
         <td align="left" width="50%" valign="center"> 
          <form action=""> 
           <select name="tests" style="width:20%;"></select> 
          </form> 
         </td> 
        </tr> 
        </table> 
       </td> 
      </tr> 
     </table> 
     <br /> 
     <table border="0" width="100%" cellpadding="0"> 
      <tr> 
       <td> 
        <table border="0" width="100%" cellpadding="0"> 
        <tr> 
         <td align="right" width="50%"> 
          Please choose the difficulty: 
         </td> 
         <td align="left" width="50%"> 
          <form action=""> 
           <select name="difficulties" style="width:20%;"></select> 
          </form> 
         </td> 
        </tr> 
        </table> 
       </td> 
      </tr> 
     </table> 
     </form> 

這只是現狀。我嘗試過其他的東西。

---

編輯： 這包括在沒有任何VALIGN事情不存在。當我嘗試添加它們時，什麼都沒有發生。