Home/ Questions/Q 8251755
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-08T00:20:28+00:00

I’m trying to figure out how the css precedence rules work in rails. I

  • 0

I’m trying to figure out how the css precedence rules work in rails.

I have an app where I want to use different css rules for different controllers and if i add some css to one of the css.scss files, it affects all controller pages.

admin.css.scss:

body {
    background: #fff;
}

rsv_ps.css.scss

body {
    background: url("DSC_1581.JPG") no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='DSC_1581.JPG', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='DSC_1581.JPG', sizingMethod='scale')";
}

If i go to both http://localhost:3000/admin or http://localhost:3000/rsvps/new, they both have the background image.

Shouldn’t any urls that start with http://localhost:3000/admin use the admin.css.scss stylesheet and not use the rsv_ps.css.scss stylesheet?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The comments by @meagar and @catfish are correct. (not sure why they’re not putting their answers in a post)

    The separate pages are just for organization, they are not for keeping the css separate. The asset pipeline will combine and minimize the separate css files into one big file.

    So you need to separate the styles yourself by using specific selectors.

    Something like

    # for admin
body.admin {

}

#html
<body class='admin'>


# for everything else
body.default {

}

#html
<body class='default'>

    To specify the markup in your layout

    <body class="<%= @admin ? 'admin' : 'default' %>">
    • 0