Bootsrap DateTimePicker渲染不正确

Question

我是Bootsrap的新手。我有datetimepicker的问题。我的日历在Chrome中呈现错误，但在Edge中可以正常显示。以下是Chrome的屏幕截图：

这是Edge的截图：

我正在开发ASP.NET Core MVC项目，这是我在视图中的代码：

<div class="wrap-input100 validate-input" data-validate="Required field">
                        <input type="text" class="form-control" id="AppointmentDate" name="date" placeholder="date">
                        <span @*class="focus-input100"*@></span>
                    </div>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>

<script>
$(document).ready(function() {
    var date_input = $('input[name="date"]'); //our date input has the name "date"
    var options = {
        format: 'mm/dd/yyyy',
        todayHighlight: true,
        autoclose: true,
        language: 'arm'
    };
    date_input.datepicker(options);
});

你能帮忙解决这个问题吗？

Answer 1

我没有你的css样式，但我建议你把它添加到日历的主要部分：

#yourmaindiv{
 width: -webkit-fit-content;
 width: -o-fit-content;
 width: -moz-fit-content;
 width: fit-content;
}

问候。