C# 引导4表-单元格内容的水平对齐不起作用

我使用Bootstrap4表来创建一个可配置的24 x 7小时调度程序。我需要每个表格单元格中的单选按钮水平对齐，始终为每个表格单元格提供所需的宽度，但我正在努力使其正常工作。请注意，当工作台超过屏幕宽度且需要水平调节器时，会出现问题

突出显示此问题的代码如下：

<div class="row form-group ml-md-2 mr-md-2">
   <div class="col-md-12">
       <table class="table table-bordered table-responsive table-hover table-striped table-condensed">
           <thead>
               <tr>
                   <th></th>
                   <th>8am</th>
                   <th>9am</th>
                   <th>10am</th>
                   <th>11am</th>
                   <th>12pm</th>
                   <th>13pm</th>
                   <th>14pm</th>
                   <th>15pm</th>
                   <th>16pm</th>
                   <th>17pm</th>
                   <th>18pm</th>
                   <th>13pm</th>
               </tr>
           </thead>
           <tbody>
               <tr>
                   <td><strong>Sun</strong></td>
                   <td>
                       <div class="form-group">
                           <div class="radio">
                               <label class="control-label font-weight-bold">
                                   <input type="radio" asp-for="@Model.MachineState" value="Manual" />
                                   <span asp-validation-for=@Model.MachineState></span>Manual
                               </label>
                           </div>
                           <div class="radio">
                               <label class="control-label font-weight-bold">
                                   <input type="radio" asp-for="@Model.MachineState" value="On" />
                                   <span asp-validation-for=@Model.MachineState></span>On
                               </label>
                           </div>
                           <div class="radio">
                               <label class="control-label font-weight-bold">
                                   <input type="radio" asp-for="@Model.MachineState" value="Off" />
                                   <span asp-validation-for=@Model.MachineState></span>Off
                               </label>
                           </div>
                       </div>
                   </td>
                   ...  @*Repeat this <td></td> for the other day - time cells. *@ 

               </tr>
           </tbody>
       </table>
   </div>
</div>
[![enter image description here][1]][1]

上午8点
上午9点
上午10点
上午11点
下午12点
下午13点
下午14点
下午15点
下午16点
下午17点
下午18点
下午13点
太阳
手册
在…上
关
...  @*对其他日期时间单元格重复此操作。*@
[！[在此处输入图像描述][1][1]

1）如果您使用的是bootsrap4，请为显示在同一行的单选按钮添加类

表单内联检查。查阅参考资料

2） 
表格
是自动调整大小的，它会自动调整，因此，与其对每个单元格进行自动滚动，不如对整个表格进行自动滚动。通过在类下面使用CSS

  overflow-y: hidden;
  overflow-x: auto;

3） 查看下面的参考资料

4） 但是，如果您想为每个单元格获得自动滚动，请创建一个类并将下面的CSS添加到每个

正如您的评论所说，您需要添加最小宽度以保持水平

您只需要在样式中添加以下css代码

<style>
    .table td:not(:first-child) {
        min-width: 100px;
    }
</style>


.表td：非（第一个孩子）{
最小宽度：100px；
}

结果如下：

您能分享这个问题的屏幕截图吗？以下使用min width样式更新是一个硬编码的解决方案：``````嗨，谢谢你的回复。请参见我添加的突出问题的图像。我需要“手动”单选按钮水平对齐，就像“开”和“关”单选按钮一样。@TommyBoyWest，请您在“radio”类中添加“width:70px”或增加宽度，直到手动文本出现在同一行中。正如我所说，表格是自动调整大小的，所以它会自动设置每个单元格的宽度。因此，要覆盖增加宽度，请检查下面的参考
<style>
    .table td:not(:first-child) {
        min-width: 100px;
    }
</style>