Html 将数据表中的内容居中

我试图理解如何让我的th标记有一个被指定为“nosortable”的类，使其单元格内容完全居中，无论是复选框还是文本。我尝试应用0的右边填充，但这一切都成功了。他们有什么想法吗

<table id="basicTable" class="table table-striped table-bordered responsive">
    <thead class="">
        <tr>
            <th class="nosortable center"><input type="checkbox" id="selectall" /></th>
            <th class="center">ID</th>
            <th>Name</th>
            <th>Email Address</th>
            <th>Username</th>
            <th>Role</th>
            <th>Status</th>
            <th class="nosortable center">Actions</th>
        </tr>
    </thead>

    <tbody>
         <tr>
                <td class="center"><input type="checkbox" name="check[]" class="tablecheck" data-id="1"/></td>
                <td class="center">1</td>
                <td>My name</td>
                <td>myemail@email.com</td>
                <td>testuser</td>
                <td>Owner</td>
                <td>Active</td>
                <td class="center">
                    <a data-original-title="Edit" href="" data-toggle="tooltip" title="" class="tooltips"><i class="fa fa-pencil"></i></a>
                    <a data-original-title="Delete" href="" data-toggle="tooltip" title="" class="delete-row tooltips"><i class="fa fa-trash-o"></i></a>            
                </td>
            </tr>
       </tbody>
   </table>

身份证件
名称
电子邮件地址
用户名
角色
地位
行动
1.
我的名字
myemail@email.com
测试用户
物主
忙碌的

---

在样式表中添加以下内容

table#basicTable th {
   text-align: center;
}

---

除了我试图居中的内容外，它将所有内容居中。JSFIDLE没有任何样式-我如何知道它应该是什么样子？而且，这与数据表无关。如果您注意到，在第一个标签中有一个复选框作为列标题。它被推到左侧，使其与其余复选框td不对齐。