Apply CSS to one page only and not all

Question

In rails I have a CSS file in my app/asset/stylesheet/x.css. I want to apply it only in a show.html.erb page in one controller.

That works correctly, but my CSS is also applied to all my app's pages.

How do I apply this CSS only on the show page? (I want a separate CSS file from my HTML).

score 3 · Accepted Answer · answered Jul 07 '15 at 17:05

Give the outermost element of the page an id, e.g. <div id="show-page"> and then in your CSS use #show-page in the selector for each style you want to apply only to that page, e.g.:

#show-page h1 {
  color: blue;
}

#show-page p {
  font-size: larger;
}

/* ...and so on... */

Apply CSS to one page only and not all

1 Answers1