Not working with Omega sub-theme

Omega is not compatible with respond.js, and due to their architectural decisions there's not much I can do about it. Sorry!

Can you elaborate as to why it is not compatible?
I have already built a site with omega and want to use respond.js.
What do I have to change in the omega theme to get it working?

It's a matter of CSS specificity and the way Omega supports old IE.

Omega outputs an IE-specific stylesheet for versions of IE which are incompatible with media queries, which overrides the "responsive" aspect of the CSS for old IE, allowing it to render fine on desktop machines. If you look at the output of an Omega subtheme (7.x-3.x to be specific), you will see something similar to the following. Consider this snippet of source code from http://drupalcampnh.org - built by Jake Strawn who also created Omega.

<!--[if (lt IE 9)&(!IEMobile)]>
<link type="text/css" rel="stylesheet" href="http://drupalcampnh.org/sites/default/files/css/css_xTxgYqRrvuQmIybZ5_eIDiwYSMYCn-4BUHkocb1DJPg.css" media="all" />
<![endif]-->

Inspecting the conditional comment, we see that this stylesheet is applied to IE browsers less than IE9 (the first version of IE to support MQs). These styles come after the primary styles wrapped in media queries, so they will always override on old IEs. If you were to remove this somehow within the Omega output, I assume that it would be possible to use respond.js. The trade-off is that it would look really awkward in old IEs until you do.

I suspect that to offer "drop-in" support for responsive layouts, the Omega maintainers decided to double up on stylesheets. This isn't necessarily a bad practice, but that is the specific reason it interferes with respond.js. The two approaches are simply incompatible.

I thought that the IE style sheet would be responsible, but while investigating I found out the client would be seeing the site in IE9, so didn't bother with respond.js.
Thank you for elaborating, I'm sure someone will find it useful in the future.

If anyone is interested in, it is possible to have that all working with responsive media queries, check out this ticket over here : #1272812: Show a warning to admins if respond.js is enabled but CSS aggregation is disabled.
Especially comment #12 does finally the trick.

Thanks rupl and Cyclodex!
I´m in the same situation and your comments helped me a lot to better understand how Omega work out IE7 and IE8 issues (and why I´ve installed respond and it didn´t worked for me).
Thanks!

Hello Drupal Community,

First time posting so please forgive if not adhering to certain standards. I will learn over time.

My issue relates to Omega 3 not working in IE8. What a surprise, right? :)

I installed Omega 3 and used starterkit omeg-html5
I've downloaded the Respond.js module version: 7.x-1.2 and is successfully installed.
I've downloaded and installed the library javascript file, as instructed by this thread
here
Going to Drupal's status report it confirms that Respond.js is enabled.

I've cleared caches a few times and then refreshed IE8, it's a no go. It looks like it's stuck displaying the mobile styling with some added narrow and normal css styling.

I'm having trouble wrapping my head around what else I need to do, as in:
Did I forget to include something in my .info file?
Do I need to add code to my template.php file?
Do I need to add HTML to my html.tpl.php?
Do I require another module?

Any guidance is appreciated.

Best Regards

The answer is very clearly spelled out in comment #3 of this issue. It explains how the Omega 7.x-3.x default configuration and respond.js are not compatible.

Maybe try turning on CSS aggregation (Admin > Config > Development > Performance > Aggregate and compress CSS files).

Aside from that, this is basically an Omega issue, not a respond.js issue. But this issue is closed so please don't re-categorize it.