0

横に並べた 2 つの HTML テーブルがあり、それらは . で囲まれていdivます。行数が異なる場合があり、動的に更新されます。

現時点では、これらのテーブル (各 3 列) には境界線がないため、視覚的には 1 つのテーブルのように見える場合があります。例: http://jsfiddle.net/qxRVF/1/

それらの間にディバイダー/セパレーター(基本的には1本の垂直線)を配置したいのですが、ディバイダーの長さを囲んでいるdivの長さと同じにする必要があります。これは固定されています。

最新のブラウザーのみで HTML と CSS を使用してこれを行うにはどうすればよいですか? これらのテーブルは長さが可変であるため、境界線を有効にすることは解決策ではありません。

4

2 に答える 2

3

外側の div の疑似要素はどうですか: http://jsfiddle.net/qxRVF/4/

.table-info:after{
    content:"";
    position:absolute;
    top:0; bottom:0; left:50%; width:0; 
    border:1px solid black;
}
于 2013-09-25T16:44:35.217 に答える
0

両方のテーブルを別々の div でラップします。次に、左 div の border-right プロパティを設定し、右 div の border-left プロパティを設定します。

于 2013-09-25T16:44:03.170 に答える