我的 Kendo 日期选择器在靠近页面底部时不可见

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>

我的 Kendo 日期选择器在靠近页面底部时不可见

My Kendo Datepicker is not visible when close to the bottom of the page

asp.net-mvc

twitter-bootstrap

kendo-ui

kendo-datepicker