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 Build a Todo List Application with Rails 4 Build a Todo List Application with Rails 4 Writing Test Helpers

Will Lam
Will Lam
7,027 Points

Where did all the CSS come from??

Where did all the CSS come from at the end? I can't find where Jason cut and pasted it .. he vaguely mentioned that he wrote some CSS before.. even though it shouldn't touch anything that's production in real life.

I found it very disjointed and wondering what the heck happened? I couldn't find it in the source files either.. unless I'm missing something entirely (or I'm just really dense...?)

1 Answer

Jason Seifer
STAFF
Jason Seifer
Treehouse Guest Teacher

Hi Will Lam you can find the css in the "Cleaning Up Our View" project files. Here's the relevant parts that go in application.css:

div.alert {
  border: 2px solid #aaa;
  padding: 10px;
}

div.flash.success { border: 2px solid green; color: green; }
div.flash.error   { border: 2px solid red;   color: red;   }
div.flash.notice  { border: 2px solid blue;  color: blue;  }

.clear { clear: both; }

div.nav {
  border-bottom: 1px solid #aaa;
  margin-bottom: 20px;
  padding: 10px 0 0 5px;
}

div.nav h1 {
  float: left;
  margin: 0 1em 0 0;
}

div.nav a { text-decoration: none !important; }

div.nav ul {
  float: left;
  list-style: none;
  clear: right;
  margin: 0 0 0 1em;
  padding: 0;
}

div.nav ul li {
  float: left;
}

div.nav ul li a {
  display: block;
  width: auto;
  padding: 8px 10px 8px 10px;
  background: #eee;
  color: #aaa;
}

div.nav ul li a:hover {
  background: #aaa;
  color: #eee;
}