So you're playing with SVG icons and images and you're loving it - but - you can't apply CSS from your stylesheet. What to do? Here's a decent solution I found.
The SVG image and CSS problem
You've tried entering raw SVG code into HTML, using IMG src tags, and even CSS background images referencing your SVG image - the image works great - but - you've discovered the CSS needs to be inline, really inline. This is no good to useless.
The (hacky) Solution
Use fonts. Upload your SVG images to fontastic.me (for example), and follow their instructions for installing these images as a font set. It's a bit of a hack, because fonts are generally squarey shaped - and your images are possibly not - you'll probably find that you will need to heavily tweak the line-heights and font-sizes and general CSS of each character/image if they are very different, but after hours of searching it's the best solution I have found so far for managing SVG images.
Hope this helped. Ping me on Twitters if you are desperate (aren't we all?)
Published by: admin in Development