如果屏幕上有足够的空间，将桌子并排放置答案

【问题标题】：Putting tables side-by-side if there is enough room on the screen如果屏幕上有足够的空间，将桌子并排放置
【发布时间】：2015-07-21 06:00:28
【问题描述】：

我有两个 HTML 表格，它们最好并排放置在屏幕上。宽屏显示器可以解决这个问题，但是在大多数老式显示器上桌子太宽而不能并排。因此，只有在分辨率足够高的情况下，我才想使用 css（或者甚至只是 HTML，如果可能的话）将表格并排放置。

这通常会自动处理图像，但有没有办法为表格做到这一点？

【问题讨论】：

标签： html css html-table

【解决方案1】：

是的，将 CSS 样式 float:left 应用于表格元素

这是关于浮动的优秀入门：http://css.maxdesign.com.au/floatutorial/

【讨论】：

【解决方案2】：

我的建议是浮动表格（记得指定表格宽度 - 在非宽屏显示器上选择一个已满的表格）。

table {
    width: 500px; /* important */
    float: left;
}

但是这也可能有效（未经测试）：

table {
    display: inline;
}

【讨论】：

表格有自己的显示，所以改为内联不是答案 - 浮动当然是正确的。

【解决方案3】：

试试这个（你可以改变窗口的大小）：

<html>
<body bgcolor="red">
<p>
    <table bgcolor="green" style="float: right;">
    <tr>
        <td>sssssssssssssssssssssssssssssssssssssssssss</td>
    </tr>
    </table>

    <table bgcolor="blue" style="float: left;">
    <tr>
        <td>eeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee</td>
    </tr>
    </table>
</p>
</body>
</html>

-->

【讨论】：