13

我有一个表格,其中列数可能会发生变化(从 1 到 10),但一列应始终保持固定宽度,这样就没有多余的空间或不换行(它将用于添加或删除表中的行)。

该表格的总宽度不应超过 800 像素,并且我希望将提交按钮浮动到右侧。

有没有办法将表格列宽设置为百分比变化,并将一个静态列设置为固定像素宽度?还是会导致问题?我尝试了许多不同的方法,但似乎都不是最理想的。有没有一种优雅的方式来做到这一点?我附上了一张图片供参考:http ://bayimg.com/BAllLLaaDP 。

的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>
4

1 回答 1

6

如果所有行的总宽度不超过 100%(如果超过行或表将被缩放以适应内容),则可以在一个表中存在宽度以像素和百分比为单位的行。如果仅出于宽度目的使用,则
可以向元素添加宽度。最好至少保留一列没有宽度,以便它可以缩小以适应。 PS我不明白你为什么需要元素。thcol
width: 100%;td

于 2012-01-17T23:16:34.683 回答