需要水平并排显示动态创建的表格

Question

我正在使用以下代码动态创建表。

    for(i=0;i<len;i++){
        txt.push("<table  class='tb1'; >");
        txt.push("<tr><td class='tb2'; width='50%'>"+list2[i][0]+"</td><td class='tb2'; width='50%'>"+list2[i][1]+"</td></tr>");
        txt.push("</table>");   
    }
    $('#divOutputArea').append(txt);

显示所有表格时，一个在另一个下面垂直显示。任何人都可以帮助我使用上面的代码水平并排显示所有表格。感谢你的时间。

Answer 1

在你的CSS上试试这个：
table.tb1 {display：inline-block;}
对我来说很好。

Answer 2

您可以使用：

table.tb1 {
    display: inline-table;
}

或在浮动div中插入每个表：

HTML

<div class="tablecontainer">
<table>
...
</table>
</div>

CSS

.tablecontainer {
    float: left;
}