I am currently trying to get to grips with bootstrap and am struggling to understand where I should be editing the CSS. I created a custom.css.scss file to edit settings in my app/assets/stylesheets folder however when I add rules they often seem to be overridden as such I have found that I have to edit certain elements by going to the external libraries bootstrap-sass resource and drilling down to the ../stylesheets/bootstrap folder where I then have to hunt for the relevant style to change. I am sure I am doing this the wrong way, is there something I should be doing to ensure my custom.css.scss has priority? Any help much appreciated!
Asked
Active
Viewed 601 times
2 Answers
2
You don't want to edit the bootstrap files themselves, but CSS rules have a precedence structure which determines which CSS rules are used. It is not terribly complicated, but is a bit tricky until you get the hang of it.
Smashing Magazine has a relatively good introduction to it with links to other sources as well.
Paul Simpson
- 2,504
- 16
- 28
-
Thanks for that. Currently I have within my app/assets/stylesheets folder a custom, scaffolds, static_pages css.scss files. However when I try to change something in the custom.css.scss for example a simple style like the 'a' link tag it reverts back to the default styles in the relevant bootstrap external library file. Does the specificity rules apply in the same way or should I be configuring something to instruct the specificity of the custom.css.scss? – Tom Apr 27 '12 at 22:37
0
In the application.css found in the assets all other styles are included you just need to change the order of these like mentioned here: Rails 3.1 Load css in particular order.
