Question

我对Stack Overflow很新，我还在学习编程。我想将两张桌子并排放置，并且防止桌子接触页面两侧。我写了这段代码，但没有得到正确的结果：

<table style="float:right; background-color: white;font-family: cursive,sans-serif; border-radius: 8%; border-color: white" border="0" width="420px" height="216px" >

    <tr style='float: left; background-color: white; border-radius: 3%; border-color: white;' width='200px' height='54px'>
        <td style='font-family: cursive,sans-serif; border-color: white; ;' width='200px' height='54px'>From</td>
        <td style="font-family: cursive,sans-serif; border-color: white; border-radius: 3%" width='200px' height='54px'>To</td>
    </tr>
</table>


<table align="center" style=" float:left; background-color: white;font-family: cursive,sans-serif; border-radius: 8%; border-color: white" border="1" width="420px" height="216px">

</table>

Answer 1

欢迎！

首先将您的样式移动到.css文件中。
我整理了一个小小的演示，check it out - 不介意表：nth-child（2n）选择器，那些也可以是类名。

Answer 2

您应该使用CSS3执行此任务。不要使用框架（它们本质上已被弃用）。你应该搜索一下。我在这个网站上找到了一个良好的开端：

Div side by side

祝你好运。

Answer 3

将一个容器div中的两个表设置为padding: 0 XXpx;，其中XX是您想要的间距。要使表正确浮动，此div的宽度必须至少为842px（浮动表的大小加上第一个的边框）。

将两张桌子并排放置，间距相等

3 个答案: