列之间的ASP.NET Bootstrap表填充不起作用

时间:2017-03-13 19:55:57

标签: asp.net-mvc twitter-bootstrap css3 asp.net-core

在我的ASP.NET MVC Core 1.1应用程序的以下View表中,我尝试在列OrderNumberItemName之间创建一些空格。但是这两列的内容仍然太接近了。是因为我css内的<style>....</style>错误,或者表格的Bootstrap默认设置是否覆盖了我的css问题:如何在两列之间创建间距?

@model MyProj.Models.TestViewModel
<style>
    table th td{
        padding-left:115px;
    }
</style>
<table>
    @foreach (var item in Model.lstOrders)
    {
        <tr>
            <td>
                <a asp-action="TestAction" asp-route-id="@item.OrderId">@item.OrderNumber</a>
            </td>
            <td>
                @item.ItemName
            </td>
        </tr>
    }
</table>

2 个答案:

答案 0 :(得分:0)

你可以:

  • 为CSS中的元素定义填充(推荐)
  • 在两者之间插入一个空列,并使用&#39;&amp; nsbp&#39;价值(讨厌的黑客,但证明有效)

...并且您的样式定义错误(提示:表中没有元素)。 试试吧

td {
    padding: 5px;
}

答案 1 :(得分:0)

你的CSS:

table th td {
    padding-left:115px;
}

表示:

为每个td的{​​{1}}孩子提供th的孩子,左边填充为115px。

相反,你想要做的是:

table

表示每个table th, table td { padding-left:115px; } th左边填充115px。