CSS Reference Lost in Some Cases

Firstly, sorry if this is a basic question - I’m pretty new to rails.

I’ve created a very basic rails application using the standard scaffold.
I have two CSS files - one global (global.css) and one that is page
specific (in this example, ammos.css). The global CSS has most of the
CSS design and the local file has code for the UI element positioning on
that page.

I have the following code in the head section of the
application.html.erb file (under the “views” folder):

Outpost Evolution <%= yield :head %>

Then I have the following code in the “_form.html.erb” file that was
generated when I generated the scaffold.

<% content_for :head do %>

<% end %>

The CSS settings show properly if I use the URL for the “/ammos/new”
page directly in the browser. However, when I go to the “/ammos” page
and then click the “New” link, the local CSS settings do not show up.
The page behaves as if they do not exist.

Would anyone know why this occurs and how it can be avoided?

On Tue, Feb 18, 2014 at 11:58 PM, Farsheed B.
[email protected]wrote:

<% content_for :head do %>

<% end %>

You should use the <%= stylesheet_link_tag ‘filename’ %> instead of
including the <link tag directly. Rails will generate the stylesheet
html
for you

Thanks,
Ganesh

Ganesh Ranganathan wrote in post #1137083:

On Tue, Feb 18, 2014 at 11:58 PM, Farsheed B.
[email protected]wrote:
You should use the <%= stylesheet_link_tag ‘filename’ %> instead of
including the <link tag directly.

Thanks Ganesh. I just tried that right now but the issue still persists.

On Wed, Feb 19, 2014 at 12:51 AM, Farsheed B.
[email protected]wrote:

Thanks Ganesh. I just tried that right now but the issue still persists.

Can you share the _form.html.erb code for head section

Does it not work on development or Production, or both?

On Wed, Feb 19, 2014 at 1:45 AM, Farsheed B.
[email protected]wrote:

<% content_for :head do %>
<%= stylesheet_link_tag ‘/stylesheets/ammos_new.css’ %>
<% end %>

Try

<% content_for :head do %>
<%= stylesheet_link_tag ‘ammos_new’ %>
<% end %>

Ganesh Ranganathan wrote in post #1137095:

On Wed, Feb 19, 2014 at 12:51 AM, Farsheed B.
[email protected]wrote:

Thanks Ganesh. I just tried that right now but the issue still persists.

Can you share the _form.html.erb code for head section

Does it not work on development or Production, or both?

It doesn’t work in dev. I don’t have a prod environment yet.

Here are the two options I have tried for the header code:

Option 1:
<% content_for :head do %>

<% end %>

Option 2 (this was based on your suggestion):
<% content_for :head do %>
<%= stylesheet_link_tag ‘/stylesheets/ammos_new.css’ %>
<% end %>

Ganesh Ranganathan wrote in post #1137105:

On Wed, Feb 19, 2014 at 1:45 AM, Farsheed B.
[email protected]wrote:
Try

<% content_for :head do %>
<%= stylesheet_link_tag ‘ammos_new’ %>
<% end %>

No difference. :frowning:

I’m using Chrome as my browser in case that makes a difference.

On Wed, Feb 19, 2014 at 2:23 AM, Farsheed B.
[email protected]wrote:

No difference. :frowning:

Have you placed the css file in the app/assets/stylesheets folder?

On 18 February 2014 20:53, Farsheed B. [email protected]
wrote:

Ganesh Ranganathan wrote in post #1137105:

On Wed, Feb 19, 2014 at 1:45 AM, Farsheed B.
[email protected]wrote:
Try

<% content_for :head do %>
<%= stylesheet_link_tag ‘ammos_new’ %>
<% end %>

No difference. :frowning:

Have you looked at the html source of the page in the browser to see
if it looks right?

Colin

Colin L. wrote in post #1137112:

On 18 February 2014 20:53, Farsheed B. [email protected]
wrote:
Have you looked at the html source of the page in the browser to see
if it looks right?

Colin

Yes, this is what I see (and it looks all right):

Ganesh Ranganathan wrote in post #1137113:

On Wed, Feb 19, 2014 at 2:23 AM, Farsheed B.
[email protected]wrote:

No difference. :frowning:

Have you placed the css file in the app/assets/stylesheets folder?

No, the CSS files are all in /public/stylesheets

On Wed, Feb 19, 2014 at 3:11 AM, Farsheed B.
[email protected]wrote:

No, the CSS files are all in /public/stylesheets

If you are using Rails 3.2 (?) and above, stylesheets need to be in
app/assets/stylesheets folder.

Thanks everyone. I moved the CSS file to app/assets/stylesheets and used
the following syntax but it still did not fix the issue.

<%= stylesheet_link_tag ‘ammos_new’ %>

Is this a known/common issue?

+1 on Ganesh’s reply, but wondering why you are not simply using “<%=
stylesheet_link_tag “application”, media: “all” %>”? That way all
stylesheets are picked up as long as you have them in the
app/assets/stylesheets
folder. Simply remove the stylesheets you don’t want.

On Fri, Feb 21, 2014 at 2:08 AM, Farsheed B.
[email protected]wrote:

Thanks everyone. I moved the CSS file to app/assets/stylesheets and used
the following syntax but it still did not fix the issue.

<%= stylesheet_link_tag ‘ammos_new’ %>

Is this a known/common issue?

Is it not working in development or production?

On Thursday, February 20, 2014 8:38:24 PM UTC, Ruby-Forum.com User
wrote:

Thanks everyone. I moved the CSS file to app/assets/stylesheets and used
the following syntax but it still did not fix the issue.

<%= stylesheet_link_tag ‘ammos_new’ %>

Is this a known/common issue?

Have you tried using your browser’s inspector to check whether the
stylesheets are loading correctly and what differences (if any) exist
between your 2 cases? Does inspecting an element that should have one of
these extra rules show that those rules have been overridden or that
they
are missing entirely?

Fred

This forum is not affiliated to the Ruby language, Ruby on Rails framework, nor any Ruby applications discussed here.

| Privacy Policy | Terms of Service | Remote Ruby Jobs