Scoping a Div on index gives a MIME Error on any other page

[Deadfire]

Hey there all a brief run down of my issue.

First I have a Navbar that uses the css of my main site. Using <style scoped> and the jquery script to allow it to work in other browsers that don't support it, I have put it at the top of my forum.

Using the following code in index.template.php of my theme:

Code Select Expand

<div>
<style type="text/css" scoped>
@import "top/style.css";
</style>
//The code of the div here
</div>


Now the css works perfectly on the Index, the Navbar gets it's own external css from the same file as the main site, and the rest follows the css for it. However the issue I have is going anywhere else on the forum I get the following error.

Code Select Expand

Resource interpreted as Stylesheet but transferred with MIME type text/html: http://~/top/style.css".

Is there something that's effecting the use of the @import on the other pages? or am I missing something?

[margarett]

A quick google search:

http://joshua.doodnauth.com/2013/02/resource-interpreted-as-script-but-transferred-with-mime-type-textplain/
Or maybe:
http://stackoverflow.com/questions/10553638/resource-interpreted-as-stylesheet-but-transferred-with-mime-type-text-html

[Deadfire]

A quick google search:

http://joshua.doodnauth.com/2013/02/resource-interpreted-as-script-but-transferred-with-mime-type-textplain/
Or maybe:
http://stackoverflow.com/questions/10553638/resource-interpreted-as-stylesheet-but-transferred-with-mime-type-text-html

The first doesn't deal with the issue as much, and this isn't a warning, it simply doesn't work on anyone's setup regardless.

The second talks about adding a line to the .htaccess which was done with nothing changed.


The Oddness of this is that it works on the index, but not on any other pages.

[Arantor]

SMF 2.0 uses XHTML 1.1 which doesn't support scoped (and your code is in any case invalid XHTML)

I always thought @import was supposed to be deprecated anyway...

[Deadfire]

SMF 2.0 uses XHTML 1.1 which doesn't support scoped (and your code is in any case invalid XHTML)

I always thought @import was supposed to be deprecated anyway...

This is why I'm using the jQuery-based scope polyfill to support scoped seems to work well when it works.

The plugin's syntax asks for @import to be used, however this doesn't explain why it works on the index, but not elsewhere.

[Arantor]

Well, the error suggests something weird is going on, I'd be looking at the actual request the browser is making and the headers in both that request and the response. The error suggests the server is sending it incorrectly, but all bets are off.

* Sir Cumber-Patcher is still not convinced this should actually be in *SMF* Coding Discussion...