1

I don't fully understand the css files with omega theme.

In sites/all/themes/omega_subtheme_2/css I have these files (among other):

omega-subtheme-2-alpha-default-narrow.css
omega-subtheme-2-alpha-default-normal.css
omega-subtheme-2-alpha-default-wide.css

Then if I resize the browser window to the smaller size (in Chrome) I expect the omega-subtheme-2-alpha-default-narrow.css to be loaded, but if I use the Inspector to see the loaded css files this file is not there.

In the theme settings I have checked: Enable the responsive grid and also I have enabled all checkboxes under Enable optional stylesheets

What am I missing here?

Below the source code to show the loaded css files: (code was generated by Firefox)

 <style type="text/css" media="all">@import url("http://localhost/mySite.com/modules/system/system.base.css?m7efjb");
@import url("http://localhost/mySite.com/modules/system/system.menus.css?m7efjb");
@import url("http://localhost/mySite.com/modules/system/system.messages.css?m7efjb");
@import url("http://localhost/mySite.com/modules/system/system.theme.css?m7efjb");</style>
<style type="text/css" media="all">@import url("http://localhost/mySite.com/sites/all/modules/adaptive_image/css/adaptive-image.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/calendar/css/calendar_multiday.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/date/date_api/date.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/date/date_popup/themes/datepicker.1.7.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/date/date_repeat_field/date_repeat_field.css?m7efjb");
@import url("http://localhost/mySite.com/modules/field/theme/field.css?m7efjb");
@import url("http://localhost/mySite.com/modules/node/node.css?m7efjb");
@import url("http://localhost/mySite.com/modules/search/search.css?m7efjb");
@import url("http://localhost/mySite.com/modules/user/user.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/views/css/views.css?m7efjb");</style>
<style type="text/css" media="all">@import url("http://localhost/mySite.com/sites/all/modules/ckeditor/ckeditor.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/colorbox/styles/default/colorbox_default_style.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/ctools/css/ctools.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/follow/icons/small.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/panels/css/panels.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/libraries/superfish/css/superfish.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/libraries/superfish/css/superfish-vertical.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/libraries/superfish/css/superfish-navbar.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/views_slideshow/views_slideshow.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/content_type_extras/css/content_type_extras.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/quicktabs/css/quicktabs.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/quicktabs/quicktabs_tabstyles/tabstyles/navlist/navlist.css?m7efjb");
@import url("http://localhost/mySite.com/modules/locale/locale.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/libraries/superfish/style/default.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/modules/ds/layouts/ds_2col_stacked_fluid/ds_2col_stacked_fluid.css?m7efjb");</style>
<style type="text/css" media="all">@import url("http://localhost/mySite.com/sites/all/themes/omega_subtheme_2/css/superfish-default.css?m7efjb");</style>
<style type="text/css" media="all">@import url("http://localhost/mySite.com/sites/all/themes/omega/alpha/css/alpha-reset.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega/alpha/css/alpha-mobile.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega/alpha/css/alpha-alpha.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega/omega/css/formalize.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega/omega/css/omega-text.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega/omega/css/omega-branding.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega/omega/css/omega-menu.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega/omega/css/omega-forms.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega/omega/css/omega-visuals.css?m7efjb");
@import url("http://localhost/mySite.com/sites/default/files/fontyourface/font.css?m7efjb");</style>
<link type="text/css" rel="stylesheet" href="http://fonts.googleapis.com/css?family=Junge:400&amp;subset=latin" media="all" />
<style type="text/css" media="all">@import url("http://localhost/mySite.com/sites/all/themes/omega_subtheme_2/css/base.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega_subtheme_2/css/global.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega_subtheme_2/css/global.css.less?m7efjb");</style>

<!--[if (lt IE 9)&(!IEMobile)]>
<style type="text/css" media="all">@import url("http://localhost/mySite.com/sites/all/themes/omega_subtheme_2/css/omega-subtheme-2-alpha-default.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega_subtheme_2/css/omega-subtheme-2-alpha-default-normal.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega/alpha/css/grid/alpha_default/normal/alpha-default-normal-12.css?m7efjb");</style>
<![endif]-->

<!--[if gte IE 9]><!-->
<style type="text/css" media="all and (min-width: 740px) and (min-device-width: 740px), (max-device-width: 800px) and (min-width: 740px) and (orientation:landscape)">@import url("http://localhost/mySite.com/sites/all/themes/omega_subtheme_2/css/omega-subtheme-2-alpha-default.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega_subtheme_2/css/omega-subtheme-2-alpha-default-narrow.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega/alpha/css/grid/alpha_default/narrow/alpha-default-narrow-12.css?m7efjb");</style>
<!--<![endif]-->

<!--[if gte IE 9]><!-->
<style type="text/css" media="all and (min-width: 980px) and (min-device-width: 980px), all and (max-device-width: 1024px) and (min-width: 1024px) and (orientation:landscape)">@import url("http://localhost/mySite.com/sites/all/themes/omega_subtheme_2/css/omega-subtheme-2-alpha-default.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega_subtheme_2/css/omega-subtheme-2-alpha-default-normal.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega/alpha/css/grid/alpha_default/normal/alpha-default-normal-12.css?m7efjb");</style>
<!--<![endif]-->

<!--[if gte IE 9]><!-->
<style type="text/css" media="all and (min-width: 1220px)">@import url("http://localhost/mySite.com/sites/all/themes/omega_subtheme_2/css/omega-subtheme-2-alpha-default.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega_subtheme_2/css/omega-subtheme-2-alpha-default-wide.css?m7efjb");
@import url("http://localhost/mySite.com/sites/all/themes/omega/alpha/css/grid/alpha_default/wide/alpha-default-wide-12.css?m7efjb");</style>
<!--<![endif]-->
  • Do you have CSS aggregation turned on? If so, turn it off. Clear CSS/JS cache. When you view source, do you see the <style> elements with the media queries on them associated with the proper sheets? – mpdonadio Jul 19 '12 at 10:48
  • CSS aggregation was turned off. I cleared all cache anyway. There are some elements with the medias queries, but they are inside conditional. I pasted the source code in the question. (code was generated by Firefox) – chefnelone Jul 19 '12 at 11:17
  • That all looks right. Which part of the debug console are you using? If you inspect the element of something with a grid-* class on it, which sheet is it reading it from? – mpdonadio Jul 19 '12 at 13:09
  • If I select a div with the class="grid-12" it read the http://localhost/mySite.com/sites/all/themes/omega/alpha/css/alpha-mobile.css?m7efjb – chefnelone Jul 19 '12 at 14:17

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.