I'm creating a custom template in Joomla 3.1.5 which I'm working off of a static web page as a model. The static page displays fine. The page has a lot of small icon / glyph style displays, including icons for facebook, twitter, google+, etc. I'm using font-awesome to create the icons. In my static html sample font-awesome tool works great.
When I create a custom responsive template in Joomla, however the CSS file gets 'corrupted' somehow.
Raw CSS file extract..
I can see exactly that content when I examine the page using firebug in Firefox browser. When I look at the same content in my joomla page, the CSS file displays the following:
Both the static site and the Joomla site are hosted from the same spot online. The content characters have somehow been transformed... and the icons don't display. The error looks the same on chrome as well.
Both the static html site and the joomla site copies of the CSS file are identical, although one uses a style directory the other a css directory. Static site call is:
Note the joomla call to the CSS file is:
I do see where there is a Content Delivery Network (CDN) link for font-awesome.css
I haven't tried that yet, will try to play with that next. At the same time does anybody have a clue why the info is becoming corrupted in the Joomla template implementation? Many thanks for your assistance, zip.
edit: One possible thought.. could this be an issue of the text encoding format used to save the .css files? ASCII vs UTF-8 without BOM vs straight UTF-8 ? I don't think I changed either copy of the file, but its certainly possible. could that be the issue? What is the correct format to be using?
edit #2: Here is the info from the web pages:
static page encoding:
Joomla template encoding: