CSS Reference Lost in Some Cases

57 views
Skip to first unread message

Farsheed Bamboat

unread,
Feb 18, 2014, 1:28:09 PM2/18/14
to rubyonra...@googlegroups.com
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):

<head>
<title>Outpost Evolution</title>
<link rel="stylesheet" type="text/css" href="/stylesheets/global.css">
<%= yield :head %>
</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 %>
<link rel="stylesheet" type="text/css"
href="/stylesheets/ammos_new.css">
<% 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?

--
Posted via http://www.ruby-forum.com/.

Ganesh Ranganathan

unread,
Feb 18, 2014, 1:35:14 PM2/18/14
to rubyonra...@googlegroups.com

On Tue, Feb 18, 2014 at 11:58 PM, Farsheed Bamboat <li...@ruby-forum.com> wrote:
<% content_for :head do %>
  <link rel="stylesheet" type="text/css"
href="/stylesheets/ammos_new.css">
<% 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

Farsheed Bamboat

unread,
Feb 18, 2014, 2:21:52 PM2/18/14
to rubyonra...@googlegroups.com
Ganesh Ranganathan wrote in post #1137083:
> On Tue, Feb 18, 2014 at 11:58 PM, Farsheed Bamboat
> <li...@ruby-forum.com>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.

Ganesh Ranganathan

unread,
Feb 18, 2014, 2:55:59 PM2/18/14
to rubyonra...@googlegroups.com

On Wed, Feb 19, 2014 at 12:51 AM, Farsheed Bamboat <li...@ruby-forum.com> 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?

Farsheed Bamboat

unread,
Feb 18, 2014, 3:15:41 PM2/18/14
to rubyonra...@googlegroups.com
Ganesh Ranganathan wrote in post #1137095:
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 %>
<link rel="stylesheet" type="text/css"
href="/stylesheets/ammos_new.css">
<% end %>

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

Ganesh Ranganathan

unread,
Feb 18, 2014, 3:26:22 PM2/18/14
to rubyonra...@googlegroups.com

On Wed, Feb 19, 2014 at 1:45 AM, Farsheed Bamboat <li...@ruby-forum.com> wrote:
<% content_for :head do %>
  <%= stylesheet_link_tag '/stylesheets/ammos_new.css' %>
<% end %>

Try

<% content_for :head do %>
  <%= stylesheet_link_tag 'ammos_new' %>
<% end %>

Farsheed Bamboat

unread,
Feb 18, 2014, 3:53:01 PM2/18/14
to rubyonra...@googlegroups.com
Ganesh Ranganathan wrote in post #1137105:
> On Wed, Feb 19, 2014 at 1:45 AM, Farsheed Bamboat
> <li...@ruby-forum.com>wrote:
> Try
>
> <% content_for :head do %>
> <%= stylesheet_link_tag 'ammos_new' %>
> <% end %>

No difference. :(

Colin Law

unread,
Feb 18, 2014, 3:55:50 PM2/18/14
to rubyonra...@googlegroups.com
On 18 February 2014 20:53, Farsheed Bamboat <li...@ruby-forum.com> wrote:
> Ganesh Ranganathan wrote in post #1137105:
>> On Wed, Feb 19, 2014 at 1:45 AM, Farsheed Bamboat
>> <li...@ruby-forum.com>wrote:
>> Try
>>
>> <% content_for :head do %>
>> <%= stylesheet_link_tag 'ammos_new' %>
>> <% end %>
>
> No difference. :(

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

Colin

Ganesh Ranganathan

unread,
Feb 18, 2014, 4:02:40 PM2/18/14
to rubyonra...@googlegroups.com

On Wed, Feb 19, 2014 at 2:23 AM, Farsheed Bamboat <li...@ruby-forum.com> wrote:
No difference. :(

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

Farsheed Bamboat

unread,
Feb 18, 2014, 4:41:47 PM2/18/14
to rubyonra...@googlegroups.com
Colin Law wrote in post #1137112:
Yes, this is what I see (and it looks all right):

<link rel="stylesheet" type="text/css" href="/stylesheets/global.css">
<link rel="stylesheet" type="text/css"
href="/stylesheets/ammos_new.css">



Ganesh Ranganathan wrote in post #1137113:
> On Wed, Feb 19, 2014 at 2:23 AM, Farsheed Bamboat
> <li...@ruby-forum.com>wrote:
>
>> No difference. :(
>
>
> Have you placed the css file in the app/assets/stylesheets folder?

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

Ganesh Ranganathan

unread,
Feb 18, 2014, 4:45:06 PM2/18/14
to rubyonra...@googlegroups.com

On Wed, Feb 19, 2014 at 3:11 AM, Farsheed Bamboat <li...@ruby-forum.com> 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.



mjenn

unread,
Feb 19, 2014, 12:46:15 PM2/19/14
to rubyonra...@googlegroups.com
+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. 

Farsheed Bamboat

unread,
Feb 20, 2014, 3:38:24 PM2/20/14
to rubyonra...@googlegroups.com
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?

Ganesh Ranganathan

unread,
Feb 20, 2014, 4:14:25 PM2/20/14
to rubyonra...@googlegroups.com

On Fri, Feb 21, 2014 at 2:08 AM, Farsheed Bamboat <li...@ruby-forum.com> 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?

Frederick Cheung

unread,
Feb 20, 2014, 4:56:30 PM2/20/14
to rubyonra...@googlegroups.com


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 
Reply all
Reply to author
Forward
0 new messages