i created subtheme of omega in my site following
http://groups.drupal.org/node/155974
when i looked page source . i found out my subtheme stylesheets are overridden by core themes style sheet

@import url("http://www.example.com/sites/all/themes/example/css/example-alpha-default-normal.css?m1nbpy");
@import url("http://www.example.com/sites/all/themes/omega/alpha/css/grid/alpha_default/normal/alpha-default-normal-12.css?m1nbpy");

i think my subtheme's stylesheets needs to be appended at last

what can i do now to change the stylesheets order

Thanks in advance

Comments

joelkbennett’s picture

joelkbennett CreditAttribution: joelkbennett commented

This is actually the correct ordering. The default stylesheet you're seeing (alpha-default-normal-12.css) is for the grid layout only. If you check the page source again look for global.css (your first custom stylesheet), you'll that is come after all of the alpha/omega sheets, minus the grid. The grid sheets are loaded based on media queries, so they have to come later.

For the most part, I'd imagine you wouldn't want to override the grid layouts. If you do have the need, you can easily get it done using more specific selectors in the width-specific stylesheet, like say:

body.responsive-layout-narrow .container-12 .grid-8 { width: 100% }

TelFiRE’s picture

TelFiRE CreditAttribution: TelFiRE commented

If I understand correctly, you just need to change your approach. The mobile styles are what goes in global, and any additional styles needed for desktop should go in default. Look into "mobile first" and "progressive enhancement" methodology.

Cellar Door’s picture

Cellar Door CreditAttribution: Cellar Door commented
Status: Active » Closed (works as designed)

Exactly correct. Omega is a mobile first theme and global.css is where you want to have all your mobile first CSS from there the stack that builds is meant to overwrite to build up through the screen sizes. Works as designed - Closing out