Glyphicons not working when using minified CSS


I am having a slightly odd issue where if I use main.min.css, glyphicons don’t appear.

If I specify my environment as ‘development’ and use main.css, they work fine (indicating the glyph font files are accessible).

I’ve disabled all caching, and tried in different browsers etc, but no luck. I’m just getting a small square icon instead of the correct icon.

main.min.css is up to date as far as I can see, as I ran grunt build as the last step, and uploaded the files (further verified by doing a search inside the minified file in chrome inspect tool for references to the glyphicons - all seems OK).

Any ideas on how to troubleshoot this would be greatly appreciated :smile:


Something must be off in your setup somewhere because a current project of mine uses minified CSS and glyphicons without issue.

Can you try it on a fresh Roots installation?

Try this:

  1. Copy the fonts from vendor/bootstrap to assets/

    cd roots;cp assets/vendor/bootstrap/fonts/* assets/fonts/

2.Change the assets/less/_variables.less from:

// Glyphicons path
// -------------------------

@icon-font-path:        "../vendor/bootstrap/fonts/";


@icon-font-path:        "../fonts/";

3.Then build and deploy.