Css 为什么我的单元格在调整大小时会向右移动？

我正在尝试调整单元格的大小，如下所示：

margin:5px;
padding:1px;
border: solid 2px;
color:blue;
text-align:center;
position:relative;
max-width:50px;

---

单元格的边框遵循CSS设置，但实际单元格似乎从容器右侧溢出。有没有办法让电池和它的容器一样宽？我有点困惑，因为我认为

标记实际上就是单元格。

我能够使用以下css直接在视图中格式化包含@html.textbox和@html.textbox的单元格：

#allAttendanceGradeHead
{
     border-collapse:collapse;
margin:1px;
padding:1px;
border: solid 2px #a8adfd;
color:Green;
 max-width: 100px;

  text-align:center;
}


 #homeworkGradeCell
 {

   border-collapse:collapse;
margin:1px;
padding:1px;
border: solid 2px;
border-color: Fuchsia;
background-color:Yellow;
 max-width:200px;



  text-align:center;

}

 <td id="homeworkGradeCell" style=" border-color:Lime">
                 @Html.TextBox("HomeworkGrade", "100", new { style = "width:60px; color:red; text-align: center" })

                 @if (@ViewBag.NumberErrorMessage != null)
                 {
                         <div id="numberRequiredMessage">
                               @ViewBag.NumberErrorMessage

                          </div>
                 }

       </td>

并且认为：

#allAttendanceGradeHead
{
     border-collapse:collapse;
margin:1px;
padding:1px;
border: solid 2px #a8adfd;
color:Green;
 max-width: 100px;

  text-align:center;
}


 #homeworkGradeCell
 {

   border-collapse:collapse;
margin:1px;
padding:1px;
border: solid 2px;
border-color: Fuchsia;
background-color:Yellow;
 max-width:200px;



  text-align:center;

}

 <td id="homeworkGradeCell" style=" border-color:Lime">
                 @Html.TextBox("HomeworkGrade", "100", new { style = "width:60px; color:red; text-align: center" })

                 @if (@ViewBag.NumberErrorMessage != null)
                 {
                         <div id="numberRequiredMessage">
                               @ViewBag.NumberErrorMessage

                          </div>
                 }

       </td>

@TextBox（“家庭作业等级”，“100”，新{style=“width:60px；color:red；text align:center”}）
@如果（@ViewBag.NumberErrorMessage！=null）
{
@ViewBag.NumberErrorMessage
}

这是@html.textboxfor

 #attendanceCodeCell
{

      color:Maroon;
    max-width:2px;
     position:relative;
     border: solid 2px #a8adfd;
    }
    And in the view:

 <td id="attendanceCodeCell">
        @Html.TextBoxFor(modelItem => item.attendanceCode, new { Value = "1",style ="      width:12px; border-color:red"})
              @Html.ValidationMessageFor(modelItem => item.attendanceCode)

       </td>

#AttendanceCo减速器
{
颜色：栗色；
最大宽度：2倍；
位置：相对位置；
边框：实心2px#a8adfd；
}
并且认为：
@Html.TextBoxFor（modelItem=>item.attendanceCode，新的{Value=“1”，style=“width:12px；边框颜色：红色”}）
@Html.ValidationMessageFor（modelItem=>item.attendanceCode）

你能在上面展示一个演示吗？

td

元素是单元格，是（*），那么是什么导致了混乱呢？在表格单元格中有一些属性不能很好地工作，或者根本不能工作，例如

位置

和

边距

。此外，

max width

用作粗略的指导原则，而不是硬限制，因此可能根本不可能以这种方式调整单元格的大小。您可能需要调整内容的大小。（*）好的，除非您给它们一个

display

属性，否则它们就不再是表单元格。但我认为这不是问题所在。