Combining and minimizing awesome css font. in mvc 4

Question

I am trying to minimize the awesome.css font, but when I minimize it, different spam characters for the content are displayed, for example:

{ content: "\f048"; } 

above are content icons such as up arrow, etc.

What is the opportunity to solve this problem?

thanks

Answer 1

Perhaps I misunderstand what you are asking for, but these are not garbage characters. These are the Unicode code codes that Font Awesome uses (in particular, the area of ​​private use). They absolutely must be in your mini CSS. Or you can use the mini CSS that comes with the awesome font.

Answer 2

I have come across this before. When you reduce, you need to specify the encoding. In the configuration of your project for xml encoding, specify:

 <?xml version="1.0" encoding="utf-8"?> 

If you are uncomfortable with the configuration or have no access, you can change the CSS.

 @charset "UTF-8"; 

In both cases, this should be the first line of the file. If you are concatenating, it should only be in the first file.

Answer 3

I solved it using the YUI Bundle Transformer

Installed via NuGet Packages

The code is as follows:

  var cssBundle = (new StyleBundle("~/bundles/css").Include( "~/Content/css/font-awesome.css"); cssBundle.Transforms.Add(new CssTransformer(new YuiCssMinifier())); bundles.Add(cssBundle); 

Answer 4

Try registering through CssRewriteUrlTransform.

For instance:

 bundles .Add(new StyleBundle("~/Content/utilities") .Include("~/Content/font-awesome.min.css", new CssRewriteUrlTransform()));