修改样式属性的CSS代码

我需要创建CSS来修改以下样式：

<th class="sort-column" data-is-only-head="false" data-field="daysElapsedfromInfoReceived" style="text-align: left;"><!-- react-text: 463 --> <!-- /react-text --><!-- react-text: 464 -->Days Elapsed From Info. Received<!-- /react-text --><!-- react-text: 465 -->  <!-- /react-text --><span class="order"><span class="dropdown"><span class="caret" style="margin: 10px 0px 10px 5px; color: rgb(204, 204, 204);"></span></span><span class="dropup"><span class="caret" style="margin: 10px 0px; color: rgb(204, 204, 204);"></span></span></span><div></div></th>

而且：

th.sort-column {
    text-align: left;
    white-space: normal !important;
}

没有运气。我需要这个th的内容在多行

根据Chrome，下一个是CSS层次结构：

---

我对您的表格进行了一些格式化，并将其涂成灰色以显示单元格大小：

th.sort-column{
文本对齐：左对齐；
背景颜色：灰色；
最小宽度：10雷姆；
}

几天过去了
信息
收到

删除

th.sort column

到

th.sort column

之间的空格/间隙也尝试过了。。。不走运。这可能是因为Bootstrap，Bootstrap的CSS可能更具体，并且覆盖了您的CSS。虽然这不是直接的答案，但感谢你的建议，我尝试了另一种选择，发现我在错误的文件夹上编译！我的意思是，我的项目复制错误：-（ThxOh，我错过了Bootstrap，抱歉。添加了它，幸运的是格式保持不变。如果你有一个包含所有组成部分的实际表，你可能会成为Bootstrap的CSS的目标。

th.sort-column {
    text-align: left;
    white-space: normal !important;
}