Question

我有一个表可以改变列数（从1到10），除了一列应该始终保持固定的宽度，这样就没有多余的空间或者它没有包裹（它会用于添加或删除表中的行。）

表格总数不应超过800px，我希望向右浮动一个提交按钮。

有没有办法将表格列宽设置为百分比，将一个静态列设置为固定像素宽度？或者会导致问题吗？我已经尝试了许多不同的方法，但似乎都不是最理想的。有一种优雅的方式来做到这一点？我附上了一张图片供参考：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>

Answer 1

如果所有行的总宽度不超过100％（如果超过行或表将缩放以适合内容），则可以存在宽度（以像素为单位）和一个表中的百分比的行。（
如果您仅为宽度目的使用th，则可以向col元素添加宽度。最好留下至少一根没有宽度的柱子，这样它就可以缩小到合适的位置附：我不明白为什么width: 100%;元素需要td。

我可以在html表格标题中混合百分比宽度和像素宽度吗？

1 个答案: