Question

I know that all of these will be compiled together into one file but the order of this is very important for me when compiling the stylesheet as it determines whether the layout is completely messed up or not.

Also, how do I change the order for this?

assets/stylesheets/application.css

/*  
  *= require jquery-ui
  *= require css-sprites
  *= require formtastic
  *= require style
*/

lib/stylesheets/lib.css

/*  
  *= require reset
*/

Is there a way I can load specifically the reset.css I have in my lib/assets/stylesheets folder before my application.css? or perhaps I could call it from within the file itself somehow? I’ve tried but I can’t get it to work.

Answer 1

I personally have an application folder in every of these 3 folders where I put all the files I want included in every pages.

Then I have an application_vendor.css in vendor where I do require_tree ./application.
Same for lib, application_libs -> require_tree ./application

And then in your application.css that you include in the layout, you can do:

/*
 *= require_self
 *= require application_libs
 *= require application_vendor
 *= require_tree ./application
 *= require other_stuff
*/

That way you can choose the order.