我正在尝试将这些很棒的字体排序图标添加到表格中，但它没有正确对齐。我也试过 ml-auto 但它没有正确对齐。
我想要的是，将箭头与单元格的右侧对齐。
如果您能提供任何帮助，我们将不胜感激。
实时代码:
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<div class="table-responsive shadow p-3 mb-5 bg-light rounded">
<table id="grid" class="table table-hover sortable">
<thead class="thead-dark">
<tr>
<th data-type="string">?</th>
<th data-type="string"><i class="fas fa-sort text-right"></i>Socre:</th>
<th data-type="number"><i class="fas fa-sort text-right"></i>Age:</th>
<th data-type="number"><i class="fas fa-sort text-right"></i>Student:</th>
<th class="wfixed" data-type="string">Status:</th>
</tr>
</thead>
</table>
</div>最佳答案
你能在标记中移动它们吗？如果是这样，只需将它们移动到文本的另一侧。
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<div class="table-responsive shadow p-3 mb-5 bg-light rounded">
<table id="grid" class="table table-hover sortable">
<thead class="thead-dark">
<tr>
<th data-type="string">?</th>
<th data-type="string"></i>Score:<i class="fas fa-sort text-right"></th>
<th data-type="number"></i>Age<i class="fas fa-sort text-right">:</th>
<th data-type="number"></i>Student:<i class="fas fa-sort text-right"></th>
<th class="wfixed" data-type="string">Status:</th>
</tr>
</thead>
</table>
</div>关于css - 将排序箭头图标添加到表格 Bootstrap 4，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58313754/