2

It seems that I misunderstood one major feature of the Omega theme. From what I see, the mobile-first basic css file - global.css - ignores the grid layout altogether and stacks elements one over another. Am I correct, or am I missing something? Does that mean that all the zones and regions will be rendered in a top-down manner with no width control?

I feel that my question is quite vague; I'd be most grateful links towards some relevant documentation and how-tos regarding the pure global.css design. I feel that most of the docs concentrate on structure of the zones& regions, while there's little sugestions as to how to make global.css work good by itself. Thanks for your attention

Improve this question

1 Answer 1

Reset to default
4

Omega is designed as a mobile-first, breakpoint responsive theme.

global.css is the mobile first sheet, so the grid system doesn't apply. The grid kicks in with the mytheme-alpha-default.css.

The answer for What's the difference between global.css and default.css files in Omega theme? goes into detail about the stylesheet convention. In summary:

  1. How does my site need to look on mobile? Make global.css
  2. How do things change when the grid system kicks in? Make mytheme-alpha-default.css
  3. How does my site look when I am viewing it in portrait mode on a tablet? Make mytheme-alpha-narrow.css
  4. How do things change when I am on a normal desktop? Make mytheme-alpha-normal.css
  5. How do things change when I am on a widescreen monitor? Make mytheme-alpha-wide.css
Improve this answer
4
  • Thank you! That's what i thought. The problem is that most of the guides and documentation concentrate on creating zones, regions, and making the whole system work as expected. (the recent webminar about omega at acquia acquia.com/resources/acquia-tv/conference/… might be a good example). What is not clear is to me is how to make the site lokk good in global.css. Any ideas about the online resources to check out?
    – Dalmaz
    Commented Apr 28, 2013 at 18:20
  • Come to think of it, @MPD, why whould it be that "global.css is the mobile first sheet, so the grid system doesn't apply"? I d'like to have a grid on iphone or android phones?
    – Dalmaz
    Commented Apr 28, 2013 at 18:22
  • if i write a style in mytheme-alpha-normal.css will it also effect on mobile or tablet?
    – Ali Nouman
    Commented May 3, 2013 at 9:02
  • @Humanlove Mobile, no. Tablet, maybe, depending on where your breakpoints are set. It would probably not affect portrait, but probably a tablet in landscape. It really depends on the screen resolution, though.
    – mpdonadio ♦
    Commented May 3, 2013 at 11:08

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.