Question

I have no idea what I’m doing wrong.

I am using Twitter Bootstrap with a basic page for a front end and serving everything with Python / WebApp2 (Not Google App Engine) in the back end.

If I load the page from the server in Internet Explorer 8, the styles appear.

If I load the page from C:/ in Chrome, the styles appear.

If I load the page from the server in Chrome, the styles do not appear.

I’ve checked all my mime types, compared the C:/ and server pages and everything looks the same.

I cannot for the life of me figure out why Chrome isn’t rendering the style sheets when served by Python / WebApp2.

I can’t figure out how to put code without it actually processing in this text box, so the page I’m using is basically the same as the example shown here:
http://twitter.github.com/bootstrap/getting-started.html

Any ideas?

Python Script for css

Non Styled – Served by Python / Webapp2 viewed in Chrome

Styled – Pulled from C viewed in Chrome

Non Styled – Chrome Resources Tab

Styled – Chrome Resources Tab

I am able to pull up CSS file in Chrome Resources tab and see contents of CSS file. No warnings that it is interpreted as text/xml in console.

Answer 1

GAAAH I just figured it out!

In my python code about, you can see I am using ‘self.response.headers.add_header’. I guess whenever you use the ‘self.response.out.write’ function, it has a ‘text/html’ content type by default. if you ‘add headers’ to that, then it adds a ‘text/css’ header before the final ‘text/html’ header. Chrome then reads the last header and uses this as the content type for the style shee. I guess IE and Opera use the first?
Anyways: to fix, use:

self.response.headers['Content-Type'] = "text/css"

and as a whole

def css(self, css_dir, filename, extension):
    self.response.headers['Content-Type'] = "text/css"
    self.response.out.write(open(css_dir + filename + extension,"rb").read())

Yay!