Html Datatable对齐标题和数据列

我已经设置了一个数据表，我希望标题和正文对齐。你可以从我插入的边界中看到它们没有，这让我疯狂地试图追踪为什么不！我的CSS不是很好，所以我可能错过了一些非常明显的东西。任何帮助都将不胜感激

CSS:

   <style>


    table.dataTable thead tr th {
        writing-mode: vertical-lr;
        border-top: 1px solid #dddddd;
        border-bottom: 1px solid #dddddd;
        border-right: 1px solid #dddddd;
    }

    th:first-child {
      border-left: 1px solid #dddddd;
    }

    table.dataTable tbody tr td {
        border-top: 1px solid #dddddd;
        border-bottom: 1px solid #dddddd;
        border-right: 1px solid #dddddd;
    }

</style>

我尝试了以下CSS，但没有任何运气：

失败的CSS

<table id="example" class="display" style="clear:both;table-layout:fixed;">

---

这是最接近我的，但是你可以看到第一列需要再宽一点

最终我自己解决了这个问题：

th:nth-child(2) {
      border-left: 1px solid #dddddd;
      width: 100px !important; 
    }

---

希望这能帮助别人

如果你能制作一个演示结果，那就太好了！

th:nth-child(2) {
      border-left: 1px solid #dddddd;
      width: 100px !important; 
    }