Динамически генерируемая таблица HTML - как ограничить ширину - PullRequest
0 голосов
/ 25 июля 2011

Я создаю динамическую таблицу с использованием MVC3.

Однако таблица выходит за пределы страницы в макете и не находится внутри общего div?

@{
    ViewBag.Title = "Users";
}

<h2>Users</h2>

<p>
    @Html.ActionLink("Create New User", "Create")
</p>


    <table>
        <tr>
            <th>
                UserID
            </th>
            <th>
                UserName
            </th>
            <th>
                UserForename
            </th>
            <th>
                PW
            </th>
            <th>
                UserTypeID
            </th>
            <th>
                PasswordMustBeChanged
            </th>
             <th></th>
        </tr>

    @foreach (var item in Model) {
        <tr>
            <td>
              @Html.DisplayFor(modelItem => item.U1_UserId)
            </td>
            <td>
                 @Html.DisplayFor(modelItem => item.U1_UserName)
            </td>
             <td>
               @Html.DisplayFor(modelItem => item.U1_UserForename)
            </td>
             <td>
               @Html.DisplayFor(modelItem => item.U1_PW)
            </td>
            <td>
                 @Html.DisplayFor(modelItem => item.U1_UserTypeID)
            </td>
             <td>
               @Html.DisplayFor(modelItem => item.U1_PasswordMustBeChanged)
            </td>
             <td>
                @Html.ActionLink("Edit", "Edit", new { id=item.U1_UserId }) |
                @Html.ActionLink("Delete", "Delete", new { id=item.U1_UserId })
            </td>       
        </tr>
    }

Это таблица, и она отображается внутри общего layotu @renderbody. Но стол не остается в пределах div ..?

Ответы [ 2 ]

1 голос
/ 25 июля 2011

Просто выстрел в темноте, но, кажется, у вас есть дополнительный <th></th> в разделе заголовка?Это специально?

0 голосов
/ 25 июля 2011

Вы можете применить стиль overflow: scroll; к основному разделу в _Layout:

<section id="main" style="overflow:scroll;">
    @RenderBody()
</section>

Таким образом, если ширина вашей таблицы больше, чем умещается на полосах прокрутки основного раздела.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...