0

我有一个这样的html代码：

<html>
<head>
    <title>Title</title>
</head>
<body style="max-width: 1680px;">

    <div style="float:left; width:100%">
        <div style="overflow: auto">
            <table style="width: 100%" border="1">
                <thead>
                    <tr>
                        <th>Col 1</th>
                        <th>Col 2</th>
                        <th>Col 3</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>Elem11-------------------------------------------------</td>
                        <td>Elem12-------------------------------------------------</td>
                        <td>Elem13-------------------------------------------------</td>
                    </tr>
                    <tr>
                        <td>Elem21</td>
                        <td>Elem22</td>
                        <td>Elem23</td>
                    </tr>
                    <tr>
                        <td>Elem31</td>
                        <td>Elem32</td>
                        <td>Elem33</td>
                    </tr>

                </tbody>
            </table>
            <div id="footer" style="width: 100%; overflow: auto;">
                <span style="width: 300px; float: left">Some footer</span>
                <span style="width: 300px">Some footer2</span>
                <span style="width: 300px; float: right;">Some footer3---------------------------------------</span>
            </div>

        </div>
    </div>
</body>
</html>

问题是出现滚动时div#footer没有正确显示，所以div#footer没有与表格的右边框对齐，但应该是（见下图）。如何使 div#footer 表现得好像它是表格的最后一行？如果答案只包含 CSS 命令，那就太好了。

不需要的空间

谢谢你。

4

2 回答 2

1

添加text-align:right

<span style="width: 300px; float: right; text-align:right">Some footer3-------------------------</span>

演示

于 2013-03-12T08:06:30.447 回答
0

您将单元格的宽度设置为百分比。设置页脚宽度时使用百分比。将百分比除以 3。33% 不等于 300px。或者，您可以拥有另一个与第一个具有相同格式的无边框表格。

于 2013-03-12T09:50:44.083 回答