Hi, I have defined a grid inside a tabstrip. Everything is fine with all the grids, but couple of them that started to display the header underneath the bottom. This does not happen on Edge. The rendered HTML shows the Header at the button of the grid content so I have the results displayed but the header isn't showing at the top. The web app is developed with .NET Core 2.2. 

This is the grid code:

CSS:

What could it be happening here?

Thanks in advance

I use grid with params

columnMenu: true,

columns: [{

    "title": "Docs",
    "command": [
    {
         "name": "B24",
         "click": func,
    }
    ],
        "locked": true,
        "lockable": false,
        "hidden": false,
},

{
    "title": "title1",
    "columns": [
    {
        "title": "title2"

....

....

....

]

And with tree header structure I do not see in columnMenu lock-unlock buttons.

How can do that they will be visible?

I use 

        @(Html.Kendo().DropDownList()
              .Name("size")
              .BindTo(new List<string>() {
                  "S - 6 3/4\"",
                  "M - 7 1/4\"",
                  "L - 7 1/8\"",
                  "XL - 7 5/8\""
              })
              .HtmlAttributes(new { style = "width: 100%" })
              )

on Index page and it working

The same I use in dialog but unsuccesfully

Code of dialog:

    <div id="popup_assignAnOrder" style="display: none; z-index: 10; background-color: white; position: absolute; left: 0; top: 0; width: 100%; height: 100%"></div>
    <script>

        function click_assignAnOrder() {
            var grid = $("#grid").data("kendoGrid");
            var data = {
                selectedIds: Object.keys(grid._selectedIds)
            };
            $.ajax({
                type: "post",
                url: "/Grid/PopupAsignPrikazi",
                data: data,
                success: function (data) {
                    var dialog = document.getElementById("popup_assignAnOrder");
                    dialog.innerHTML = data;
                    $(dialog).show('fast');

action

        [HttpPost]
        public ActionResult PopupAsignPrikazi(string[] selectedIds)
        {
            ViewBag.Tip = _db.Prikazs.Select(p => new SelectListItem(){ Value = p.Tipp.Kod_tipp.ToString(), Text = p.Tipp.Tipp1 }).Distinct().ToList();
            ViewBag.Osnovanie = _db.Prikazs.Select(p => p.Osnovanie).Distinct().ToList();
            ViewBag.SelectedIds = selectedIds.Select(Int32.Parse);
            return PartialView("~/Views/Home/_PopupAddPrikazi.cshtml");
        }

when splitter moved to the right, Gantt's header's width was expanded,but  The  Width of Gantt's timeLine was not expanded.

I think your Gantt's timeLine's width is not Automatic calculated.

How can I solve this situation？

In angular10, we use your Gantt

we want to modify Gantt’s  dayHeaderTemplate In my own Customize Format Method。

but Google browser tell us my Customize Format Method was not defined.

How to solve this problem？

Is there a way to check if the click event on a node had the control key? Unlike the drag/drop events where you can get the original event, I cannot see the same with the select event...

Matt