Telerik Forums
UI for ASP.NET MVC Forum
0 answers
136 views
1 answer
1.4K+ views

I'm following this video tutorial:

https://learn.telerik.com/learn/course/external/view/elearning/3/telerik-ui-for-aspnet-mvc


My application does not appear to be rendering Kendo CSS properly. 

Here is my BundleConfig.cs

    public class BundleConfig
    {
        // For more information on bundling, visit https://go.microsoft.com/fwlink/?LinkId=301862
        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.validate*"));

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at https://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

            bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                      "~/Scripts/bootstrap.js"));

            bundles.Add(new ScriptBundle("~/bundles/kendojs").Include(
                        "~/Scripts/kendo/2021.3.1207/kendo.all.min.js",
                        "~/Scripts/kendo/2021.3.1207/kendo.aspnetmvc.min.js"));

            bundles.Add(new StyleBundle("~/Content/css").Include(
                      "~/Content/bootstrap.css",
                      "~/Content/styles/site.css"));

            bundles.Add(new StyleBundle("~/Content/kendocss").Include(
                      "~/Content/kendo/2021.3.1207/kendo.default-v2.min.css"));

            bundles.Add(new StyleBundle("~/Content/dashboardcss").Include(
                "~/Content/styles/dashboard.css"));

            bundles.Add(new StyleBundle("~/Content/backlogcss").Include(
                "~/Content/styles/backlog.css"));

            bundles.Add(new StyleBundle("~/Content/detailcss").Include(
                "~/Content/styles/detail.css"));
        }

 

Here is the head tag in my _Layout.cshtml:


<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>RPS Project Tracker</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/Content/kendocss")
    @Scripts.Render("~/bundles/modernizr")
    @RenderSection("styles", required: false)
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")

    @Scripts.Render("~/bundles/kendojs")

    @Html.Kendo().DeferredScripts()
    @RenderSection("scripts", required: false)
</head>

Here's some examples of the errors in my UI:

in /Backlog/{id}/Details view, my DropDownListFor has no styling attributes:

 

On the Dashboard and Backlog pages, my buttons have broken styling:

Inside DevTools, I'm getting the following error:

 

Any help sorting this out is greatly appreciated.

 

 

Eyup
Telerik team
 answered on 29 Dec 2021
Narrow your results
Selected tags
Tags
+? more
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?