Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Ruby

Posted by evaconnors
evaconnors
9,198 Points

CSS from statuses.css.scss not showing up?

Following the RoR introduction, building Treebook:

In the "Updating the Index Page" video of the Frontend Development badge of the project, the instruction was to add the following code to statuses.css.scss:

.status {
        border-bottom: solid 1px #CCC;
        padding: 5px 0;
}

.status p {
        margin: 4px 0;
}

 .status .admin {

        display: none;

}

...which I did. But it doesn't show up on the All Statuses page. All the other tweaks to the other files from that video (and those before it) worked flawlessly -- I feel like it's a big glaring simple mistake, but can't figure out why none of the CSS from that page will show up?

4 Answers

Twiz T
Twiz T
12,588 Points

Your css looks to be good, can you post your markup file?

evaconnors
evaconnors
9,198 Points

I'm sorry, I know this sounds silly but I'm not quite sure what you mean -- I've actually not learned CSS yet (I'm doing the HTML course as a refresher along side the RoR project, and then I'll go through CSS as well). Currently just trying to follow along with the videos as best as I can.

EDIT: If it makes any difference, this is an external sheet, and what I copy and pasted is literally the entire thing.

Twiz T
Twiz T
12,588 Points

Not silly at all!

What I mean is can you post the code for the HTML (hypertext markup language) page this css corresponds to? This will be under 

views/statuses/index.html.erb

My guess is maybe it's an issue with the classes you have on your html elements. That is usually my first sanity check, for ex:

This WONT work views/statuses/index.html.erb

<div class="statsus">I have no border, and no padding :(</div>

statuses.css.scss

.status {
 border-bottom: solid 1px #CCC;
 padding: 5px 0;
}

The Css above won't render because I have a typo on the class for the corresponding html element.

evaconnors
evaconnors
9,198 Points

OH. Duh!!

I had 

<div class="stats">

...apparently I missed a 'u'.

Of course. Thank you so much for your help!!

Lee Carter
Lee Carter
278 Points
Lee Carter
Lee Carter
278 Points

Hey,

I have the same problem except I don't see what is wrong with either file. Posted below.

index.html.erb

<div class="page-header">
<h1>All of the Statuses</h1>
</div>

<% @statuses.each do |status| %>
<div class="status">
 <strong><%= status.name %></strong>
 <p><%= status.content %></p>
 <div class="meta">
  <%= link_to time_ago_in_words(status.created_at) + " ago", status %> 
  <span class="admin">
    | <%= link_to "Edit", edit_status_path(status) %> | 
    <%= link_to "Delete", status, method: :delete, data: { confirm: "Are you sure your want to delete this     status?"} %>
   </span>
 </div>
</div>
<% end %>

and statuses.css.scss

.status {
  border-bottom: solid 1px black;
  padding: 5px 0;
}

.status p {
  margin: 4px 0;
}

Does anyone see what I am doing wrong?

pat saunders
pat saunders
6,636 Points
pat saunders
pat saunders
6,636 Points

Did anyone get a good answer for this?

Ronald Hernandez
PLUS
Ronald Hernandez
Courses Plus Student 133 Points
Ronald Hernandez
Ronald Hernandez
Courses Plus Student 133 Points

Yeah for some reason it's not working :(