Bootstrap icons are loaded locally but not when online

by

We recently had similar issue (though we were using metroUI – http://metroui.org.ua/). Essentially it turned out we were bundling the css files and because of that when we deployed the application in Windows Azure, none of the fonts were loaded.

In our case, we had the following directory structure:

enter image description here

and modern.css was referencing fonts like

../fonts/iconFont.eot

and we were bundling the css file like this:

bundles.Add(new StyleBundle("~/Content/css").Include(
                "~/Content/css/modern.css",
                "~/Content/css/modern-responsive.css"));

Because of bundling, the application was looking for fonts in /fonts directory at the application root which was obviously not there.

Long story short, we ended up changing the bundle name: 

bundles.Add(new StyleBundle("~/Content/css/metroUI").Include(
                "~/Content/css/modern.css",
                "~/Content/css/modern-responsive.css"));

Once the bundle name was changed, things started working properly.

More Related Contents:

  1. Bootstrap dropdown sub menu missing
  2. What is the difference among col-lg-*, col-md-* and col-sm-* in Bootstrap?
  3. Center a column using Twitter Bootstrap 3
  4. Bootstrap 3 fluid grid layout issues?
  5. Bootstrap 3 Navbar with Logo
  6. How to change the bootstrap primary color?
  7. Why did Bootstrap 3 switch to box-sizing: border-box?
  8. How to use particular CSS styles based on screen size / device
  9. Bootstrap: how to stack divs of different heights?
  10. Right to Left support for Twitter Bootstrap 3
  11. Input widths on Bootstrap 3
  12. Change the order of col-*-12 columns in Bootstrap using push/pull
  13. Bootstrap 3 – Use more than 12 columns in a row
  14. Bootstrap xs columns wrap
  15. Changing the width of Bootstrap popover
  16. How to change btn color in Bootstrap
  17. Bootstrap 3 – desktop view on a mobile device
  18. Bootstrap 3 Slide in Menu / Navbar on Mobile [closed]
  19. Twitter’s Bootstrap 3 grid, changing breakpoint and removing padding
  20. Make column fixed position in bootstrap
  21. Bootstrap 3: pull-right for col-lg only
  22. How to use vertical align in bootstrap
  23. How to add a search box with icon to the navbar in Bootstrap 3?
  24. Bootstrap change div order with pull-right, pull-left on 3 columns
  25. Shrinking navigation bar when scrolling down (bootstrap3)
  26. Make Bootstrap’s Carousel both center AND responsive?
  27. Vertically align Bootstrap badge inside heading
  28. Center a column using Twitter Bootstrap
  29. Custom CSS being overridden by Bootstrap CSS
  30. Bootstrap Grid System new line does not look nice

Leave a Comment