靠近页面底部时，我的Kendo Datepicker不可见

Question

在ASP Razor下使用Kendo日期选择器时，如果选择器靠近页面底部，控件将在可见区域外打开。它也会在离控制器很远的地方打开。

@model [Company].DebugViewModel

<h2>Development Debug Page</h2>

@using (Html.BeginForm("Index", "Debug", FormMethod.Post))
{
<div class="form-group">
    <label for="DebugDate">Blank Space:</label>
    <div style="height:2000px; background-color:lightgray;">&nbsp;</div>
</div>
<div class="form-group">
    <label for="DebugDate">Debug Date:</label>
    @Html.Kendo().DatePickerFor(a => a.DebugDate)
</div>
<div class="form-group">
    <input type="submit" class="btn btn-primary" style="width:120px;" value="Save" />
</div>
}

这是一张图片：

Answer 1

最后，感谢我收到的反馈，我决定从项目中删除bootstrap。幸运的是，这是一个仅限桌面的应用程序。

以下是我最终使用的内容：

<style>
body {
    padding: 0 0 20px 0;
    margin: 0;
    position:relative; /* Fixed Kendo widget box problem */
}
.form-container {
    width: 100%;
    max-width:800px;
    margin: 16px auto;
}
</style>

<div class="k-content form-container">
<ul>
        <li>
            <label for="ID">ID:</label>
            @Html.Kendo().TextBoxFor(a => a.ID)
        </li>
        <li>
            <label for="Date">Date:</label>
            @Html.Kendo().DatePickerFor(a => a.Date)
        </li>
</ul>
</div>