html - 在两个并排的桌子之间放置一个分隔器/分隔符

Question

我有两个并排的 HTML 表格，它们包含在div. 它们可能有不同的行数，并且它们是动态更新的。

目前，这些表没有边框（每个表有 3 列），因此在视觉上它们可能看起来像一个表。这里的例子：http: //jsfiddle.net/qxRVF/1/

我想在它们之间放置一个分隔符/分隔符（基本上是一条垂直线），并且我希望分隔符的长度与封闭的 div 的长度相同，这是固定的。

如何仅在现代浏览器中使用 HTML 和 CSS？在这些表格上启用边框不是解决方案，因为它们具有可变长度。

Answer 1

外部 div 上的伪元素怎么样：http: //jsfiddle.net/qxRVF/4/

.table-info:after{
    content:"";
    position:absolute;
    top:0; bottom:0; left:50%; width:0; 
    border:1px solid black;
}

Answer 2

将两个表包装在单独的 div 中。然后设置left div的border-right属性，设置right div的border-left属性。