This is a migrated thread and some comments may be shown as answers.

Styling not working for Grid

1 Answer 118 Views
This is a migrated thread and some comments may be shown as answers.
Mike
Top achievements
Rank 1
Mike asked on 21 Jun 2018, 01:37 PM

I'm porting an MVC application that uses Kendo UI to .NET Core.  The existing application has considerable styling created by another team and the ported application needs to look like the old one.  The new application is not picking up the old styles (I've double checked the css files and I'm sure they're all in the right location).  My source looks like this:

    <div class="col-md-10">
            @(Html.Kendo().Grid<FundViewModel>()
                                    .Name("grid")

                                        ....

When I look at the HTML source on the old code, I see:

<div class="k-widget k-grid" id="grid">

Wrapping the kendoGrid object.  When I look at the HTML source for the new code, I see:

<div id="grid" name="grid">

Around the grid.  Is there a difference between the MVC and .NET Core products in the way the default styles are specified?  Is there any reference reading material that talks about styling in the .NET Core product?  Is there a way to explicitly state what styles are used?

1 Answer, 1 is accepted

Sort by
0
Dimitar
Telerik team
answered on 26 Jun 2018, 07:46 AM
Hello Mike,

In general, if you are using identical Kendo UI Theme for both projects and there are no custom styling rules applied on the Grid, the end result should look the same. Take a look at the following Grid demos from both suites (MVC and Core) and you will notice that they look the same:


If the k-grid and k-widget classes are missing from the Grid wrapper, this usually means that the widget is not correctly initialized. To pin-down the exact cause for the issue, please refer to the points listed below:

  • Follow the Getting Started article for ASP.NET Core and make sure that the Telerik.UI.for.AspNet.Core package is successfully installed. 

  • Check the Layout file of the application to verify that the desired Kendo UI Theme is referenced.

  • After the application has loaded, check the browser console tab in the Developer Tools for any JavaScript errors that might indicate what the origin of the issue is.

  • Open the browser network tab and verify that the kendo stylesheets are loaded correctly.

Concerning the Kendo UI Themes, there are currently two types:


For a quick preview of each theme, please review to the Grid Demo for ASP.NET Core. You will notice that there is a dropdown arrow menu at the top-right corner above the Demo title, that could be used to switch between the themes.

Regards,
Dimitar
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Asked by
Mike
Top achievements
Rank 1
Answers by
Dimitar
Telerik team
Share this question
or