将表格标题移动到页面顶部

Question

我正在尝试将整个表格标题从页面顶部开始，但是在尝试了几次之后，我仍然无法做到这一点。

这是我目前的代码：

<table data-role="table" data-mode="column" class="table" id ="table" border='1' align = "right" height="100">

<thead>

 <th bgcolor="#ed0924" text-shadow: 2px 2px 4px #000000;>Ranking</th>
 <th bgcolor="#ed0924">Name</th>
 <th bgcolor="#ed0924">Remaining HP</th>

[enter image description here][1]</thead>

<tbody id="mybody">

</tbody>
</table>

我的代码在小提琴中：https://jsfiddle.net/6gogLnfp/

我想问题是我将它放入jsfiddle，它出现在页面顶部但是，如果你参考我的截图，它会一直到底部。只有当我插入值时，它才会开始向上移动。