Sort arrow misalignment in th of table

[wrobbinz]

Describe the bug

In a sortable table, on a narrow window size, when a column (col A) contains a cell with a long string of text, <th>s to the right of col A lose their sort-arrow alignment.

Steps to reproduce the bug

1. Go to this CodeSandbox
2. Narrow your the view until you notice the sort-arrows jump out of alignment.
   

Expected behavior

The sort-arrow icons should remain aligned with the text of the <th>.

Versions

Libraries:

• BootstrapVue: 2.0.0-rc.28
• Bootstrap: 4.3.1
• Vue: 2.5.22

Environment:

• Device: Macbook Pro
• OS: macOS Mojave
• Browser: Chrome
• Version: 75

Demo link

https://codesandbox.io/s/vue-template-mxipj

Additional context

I did find this open issue #3696, which is similar but appears to be different. (overlap vs misalignment)

[tmorehouse]

Actually issue #3696 is related, caused by the same issues.

v2.0.0 stable will have new SVG based sort icons used as background images, which will fix this issue.

[tmorehouse]

BootstrapVue v2.0.0 stable has been released. See https://bootstrap-vue.js.org/docs/misc/changelog