html - 当行中没有足够的项目时，使动态生成的表保持在表单中

Question

我正在使用 asp.net MVC。我在 View 中连续动态生成了包含 5 个项目的表。但是当模型没有足够的 5 个项目时我有一个问题，项目宽度将增加以填充如下所示的行:

| x | x | x | x | x | (when have >=5 item)

|    x    |    x    | (when have <5 item, in this case is 2)

| x | x |             (what I want to display) 

这是我的 cshtml 代码:

<table style="width:100%;height:100%">
    @{
        int count = 0;
        foreach (var thread in Model)
        {
            if (count % 5 == 0)
            {
                @:<tr>
            }
            <td style="width:20%">
                //thread details here
            </td>
            count++;
            if (count % 5 == 0)
            {
                @:</tr>
            }
        }
    }
</table>

我可以更改为每行 2 个项目或在 中使用固定宽度，但这不是我的目标。 你能建议我一些改进我的 table 的方法吗？

Answer 1

我通过添加更多空白解决了这个问题 <td>如果我的项目小于 5，则在行中。现在它显示为我想要的

<table style="width:100%;height:100%">
@{
    int count = 0;
    foreach (var thread in Model)
    {
        if (count % 5 == 0)
        {
            @:<tr>
        }
        <td style="width:20%">
            //thread details here
        </td>
        count++;
        if (count % 5 == 0)
        {
            @:</tr>
        }
    }
    while (count%5!=0)
    {
        <td></td>
        count++;
    }
    @:</tr>
}
</table>