Extremely frustrating behavior with Internet Explorer, Bootstrap and Respond.js

Question

I'm attempting to rewrite my unfinished site http://mirai.ca in the Racket programming language rather than PHP, which I had started to rather dislike. The problem is that I can't just copy-and-paste HTML; Racket uses S-expressions to represent XML and I must use them to build my site. The syntax should be an easy translation, but Racket's not the point here.

Rather, it is IE 8 support. This is getting me crazy. http://mirai.ca works absolutely fine in IE 8, with respond.js handling CSS3 responsive design, etc etc. Now http://staging.mirai.ca , which should be a straightforward translation of the first half of the page (minus some fancy CSS) into Sexps, just doesn't work . IE 8 refuses to do responsive resizing.

The outputted HTML on both sites are basically human-readable, one just needs to run them through a beautifier or something. I just cannot find the difference leading to the different behavior! This is soooo frustrating, and I've already spent like 4 hours scratching my head over this.

Answer 1

Racket uses S-expressions to represent XML and I must use them to build my site.

Have you looked at templates?

http://docs.racket-lang.org/web-server/templates.html?q=template