5

How to add css files in asp.net mvc4 project. I have 3 css files like this

 images/img.css
content/con.css
styles.css

i added in bundleconfig.vb but its not working.

 bundles.Add(New StyleBundle("~/Content/css").Include("~/images/img.css"))
 bundles.Add(New StyleBundle("~/Content/css").Include("~/content/con.css"))
 bundles.Add(New StyleBundle("~/Content/css").Include("~/styles.css"))

In view page

<%: Styles.Render("~/Content/css") %>
<%: Scripts.Render("~/bundles/modernizr") %>

3 Answers 3

8

Try this :

bundles.Add(New StyleBundle("~/AllStyles").IncludeDirectory("~/images","img.css")_
                         .IncludeDirectory("~/content","con.css")_
                         .Include("~/styles.css"))

In your view Page:

<%: Styles.Render("~/AllStyles") %>

or

bundles.Add(New StyleBundle("~/bundles/img").Include("~/images/img.css"))
bundles.Add(New StyleBundle("~/bundles/content").Include("~/content/con.css"))
bundles.Add(New StyleBundle("~/bundles/style").Include("~/styles.css"))

In your view Page:

<%: Styles.Render("~/bundles/img","~/bundles/content","~/bundles/style") %>

And remind that you must add in the Global.asax.vb file this BundleConfig.RegisterBundles(BundleTable.Bundles);

Sign up to request clarification or add additional context in comments.

1 Comment

First time doing this...guiding with your solution...awesome + 1
1

Correct way to include multiple css/js into a single bundle:

 bundles.Add(New StyleBundle("~/Content/css").Include(
     "~/images/img.css",
     "~/content/con.css",
     "~/styles.css"))

What your origin code did is registering 3 bundles overwriting each other and after all only 1 css get included.

Comments

0

Yes, you must register the bundles in your application.

(this is for c# but very similar code to vb)

Global.asax.cs :

      protected void Application_Start()
      {

        AreaRegistration.RegisterAllAreas();

            // Register the bundles
            BundleConfig.RegisterBundles(BundleTable.Bundles); 
      }

BundleConfig.cs :

public class BundleConfig
 {
    // For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new StyleBundle("~bundles/someCss").Include(
                    "~/css/myothercssfile.css*",
                    "~/css/mycss.css*"
                   ));               
    }

And this code in your view :

<%: Styles.Render("~/bundles/someCss") %>

1 Comment

It should be Global.asax.vb.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.