1

我有一个奇怪的情况,我有一张桌子,每一行都有一个 ajax 表单。 Form不允许进入tr,但允许进入td。所以我不得不将所有列放在 atd中并手动匹配大小。问题是 HtmlHelpers(ASP.Net MVC Razor) 添加的填充和边距,导致内容未在正确的标题列下对齐。

我需要编写一个css,在给定的类中递归地消除所有项目的所有边距和填充。我怎样才能做到这一点?

或者有没有更简单的方法来强制对齐标题下的内容?

<table style="width: 100%">
<thead>
    <tr>
        <th style="width: 5%">Id</th>
        <th style="width: 35%">Material</th>
        <th style="width: 60%">Description</th>
    </tr>
</thead>
<tbody>
    @foreach (var item in Model.items){
        <tr>
            <td class="noMarginAndPadding" colspan="3">
            @using (@Ajax.BeginForm()){
                <span style="width: 5%">@Html.TextBoxFor(i => item.Id)</span>
                <span style="width: 35%">@Html.TextBoxFor(i => item.Name)</span>
                <span style="width: 60%">@Html.TextBoxFor(i => item.Description)</span>
            }
             </td>
        </tr>
    }
</tbody>

4

1 回答 1

2

<span>s 是内联元素,它们不能接受宽度、高度..

要允许接受宽度,请添加 display: block; 到 Span 的 CSS。

否则使用 Div 而不是 Span

@using (Ajax.BeginForm("Result", new AjaxOptions { UpdateTargetId ="result"}))
 {
      <div style="width:5%;float:left;text-align:center" >@Html.TextBoxFor(i => item.Id)</div>
      <div style="width: 35%;float:left;text-align:center">@Html.TextBoxFor(i => item.Name)</div>
      <div style="width: 60%;float:left;text-align:center">@Html.TextBoxFor(i => item.Description)</div>
 }
于 2013-03-21T06:17:26.700 回答