我可以在我的html表頭中混合百分比寬度和像素寬度嗎？

我有一個表的列數可能會改變（從1到10），除了一列應該始終保持在一個固定的寬度，以便沒有額外的空間或它不會包裝（它會用於添加或刪除表中的行）。我可以在我的html表頭中混合百分比寬度和像素寬度嗎？

該表應該不超過800像素總數，我想有一個提交按鈕漂浮在右邊。

有沒有辦法將表列寬度設置爲百分比，將一個靜態列設置爲固定的像素寬度？或者會導致問題？我嘗試了許多不同的方法，但都不盡人意。有沒有一個優雅的方式來做到這一點？我附上了一張圖片供參考：http://bayimg.com/BAlLLaaDP。

的HTML：

與以像素爲單位的寬度和百分比在一個表

<html> 
    <head> 
    <style> 
     #container { 
     width: 800px; 
     } 
     #table_container { 
     padding:5px; 
     } 
     #table_container table { 
     width: 85%; 
     } 
     .action { 
     } 
     col { 
     width:29%; 
     } 
     table { 
     width:650px; 
     table-layout: fixed; 
     float: left; 
     } 
    </style> 
    </head> 

<body> 
<div id="container" class="clearfix"> 

    <form> 
      <table class="" border=1> 
       <colgroup> 
        <col > 
        <col> 
        <col> 
        <col class="action"> 
       </colgroup> 
       <th>First Name</th> 
       <th>Last Name</th> 
       <th>Email </th> 
       <th></th> 
       <tr> 
        <td>content 1</td> 
        <td>content 2</td> 
        <td>content 3 </td> 
        <td><a href="">delete row</a> 
       </tr> 
       <tr> 
        <td>content 1</td> 
        <td>content 2</td> 
        <td>content 3 </td> 
        <td><a href="">delete row</a> 
       </tr> 
      </table> 
     <div class="mult_answer"> 
      <button class="button orange">Submit Answer</button> 
     </div> 
     </form> 

</div> 

</body> 
</html>

來源

2012-01-17 David

可以有排如果所有行的總寬度不超過100％（如果不是行或表更多將被調整來合適的內容）。
如果僅爲寬度目的使用col，則可以將寬度添加到th元素。最好留下至少一個沒有寬度的列，以便縮小以適合它。
P.S.我不明白你爲什麼需要width: 100%;作爲td元素。

來源

2012-01-17 23:16:34

謝謝。我刪除了td元素的寬度，這不應該在那裏。 – David 2012-01-17 23:34:49

我可以在我的html表頭中混合百分比寬度和像素寬度嗎？

回答

相關問題