Embedding Glyphicons in CSS as data-uri -


i have web application uses glyphicons, client restricted downloading fonts.

i found page says can convert uri glyphicon files , embed them in bootstrap css, did.

(partial listing)

@font-face {   font-family: 'glyphicons halflings';   src: "data:application/octet-stream;base64,n04aaefnaaac.......

when test on server, box glyph should be. did miss step?

the application use sass-- problem?

there few errors in listing snippet:

  • src datauri value must inside url() 'function',
  • it must have either correct mime type instead of application/octet-stream: e.g. application/font-woff,
  • or corresponding format() declaration: e.g. format('woff'). or better both.

correct template should like

@font-face {     font-family: '[name]';     src: url(data:font/[mime-format];base64,...) format('[css-format]');     /* font-weight, font-style, ... */ }

sass should not problem resulting snippet long file .scss , not .sass.


-