獲取水平列表以對齊html表格的頂部css

n00b嘗試在頁面頂部創建一個簡單的導航欄。我無法獲得水平列表來對齊表格單元格的頂部。獲取水平列表以對齊html表格的頂部css

具體而言，我不想'項目1'和'項目2'在表格頂部對齊。最終，我希望'Logo Here'部分一直到左側，'項目'一直到右側。

當然，我會解決讓'物品'在頂部對齊的問題。

HTML：

<table cellpadding="0" border="1"> 
     <tr> 
      <td valign="top">Logo Here</td> 
      <td valign="top">Total Accounts: Logged On: Last Updated:</td> 
      <td> 
       <ul id="navlist"> 
        <li><a href="#">Item 1</a></li> 
        <li><a href="#">Item 2</a></li> 
       </ul> 
      </td> 
     </tr> 
    </table>

CSS：

#navlist li 
    { 
     display: inline; 
     list-style-type: none; 
     padding-right: 20px; 
     vertical-align: text-top; 
    }

來源

2013-03-03 dwstein

表格用於數據不佈局。以這種方式使用表格在語義上是不正確的。 – 2013-03-03 02:59:49

夠公平的。我應該使用什麼？ – dwstein 2013-03-03 03:00:43

標籤像'div，span，頁眉，頁腳，導航，欄目，文章，旁邊'。 – 2013-03-03 03:02:45

我們不應該使用佈局的表，但這裏的解決提出的問題來。

uls默認情況下有填充和邊距。嘗試刪除它

#navlist { 
    padding:0; 
    margin:0; 
    float:right; /* and to get the items to the right */ 
}

例子：http://jsfiddle.net/vQvvZ/

，因爲你指定我做了表格寬度100％「和‘項目’一路的權利。」

來源

2013-03-03 03:02:26 Popnoodles

獲取水平列表以對齊html表格的頂部css

回答

相關問題