I've noticed that my Sitefinity website is rendering the CSS theme files differently in Safari than Chrome, Firefox, and even IE. I'm using the cssLoadOrder.xml method of calling the theme CSS files.
In non-Safari browsers, all the CSS files are called like this:
"[css file url]"
In Safari, most of the CSS files are called like this, embedded in the page:
>CSS style file content embedded in page</
Although there is one CSS file in my theme folder that's called like in other browsers, and I can't figure out why that's different. There's nothing different about it as far as I can tell.
This matters to me since even the default Sitefinity styles are called like this, embedded in the page. And for some reason Telerik.Sitefinity.Resources.Themes.LayoutsBasics.css is loaded after all of my theme files in the front-end, despite following all the advice in this thread.
But obviously that hack doesn't work if the CSS file content is embedded directly in the page. This completely breaks my site layout in Safari. My only/last resort is to embed yet another CSS file in my page template, whose only purpose is to overwrite Telerik.Sitefinity.Resources.Themes.LayoutsBasics.css, and using a lot of !important which obviously isn't great front-end practice...
Is there a documented explanation as to why it's rendering differently in Safari? I haven't seen it.