Bootstrap 4 相同的Html不同的表

我有一个非常复杂的表格用于报告。 下面的html代码是通过react生成的。 它是有效的引导4和html代码。 每次它都会生成不同的表输出

<table class="text-center table table-bordered table-striped">
    <tbody>
        <tr class="table-secondary">
            <td rowspan="4" colspan="1" style="vertical-align: middle;">Area / Department</td>
            <td rowspan="1" colspan="2">Station Details</td>
        </tr>
        <tr>
            <td rowspan="1" colspan="1">Station No</td>
            <td rowspan="1" colspan="1">Location Name</td>
        </tr>
        <tr>
            <td rowspan="1" colspan="1">129</td>
            <td rowspan="1" colspan="1">Recovery Room</td>
        </tr>
    </tbody>
</table>
<table class="text-center table table-bordered table-striped">
    <tbody>
        <tr class="table-secondary">
            <td rowspan="4" colspan="1" style="vertical-align: middle;">Area / Department</td>
            <td rowspan="1" colspan="2">Station Details</td>
        </tr>
        <tr>
            <td rowspan="1" colspan="1">Station No</td>
            <td rowspan="1" colspan="1">Location Name</td>
        </tr>
        <tr>
            <td rowspan="1" colspan="1">130</td>
            <td rowspan="1" colspan="1">Bonded Warehouse</td>
        </tr>
    </tbody>
</table>

地区/部门
车站详情
车站号
地点名称
129
康复室
地区/部门
车站详情
车站号
地点名称
130
保税仓库

---

如何每次生成相同的布局

您不能：行为会根据内容发生变化

尝试一些CSS样式，例如为每个单元格指定一个唯一的宽度

td { width: 150px; }

---

你能更具体地说明你想要达到的目标吗？我已经编辑了上面的问题，这是因为你的表格内容中的文本大小不同。您只需对

设置一个固定宽度即可解决此问题。