样式表错误-Ruby on Rails新手

Question

I am currently learning ruby on rails through "Agile Web Development With Rails," and I have run into an error I cannot fix. So far, I have only done some basic operations. I created a scaffold with a command similar to this:

rails generate scaffold Product title:string description:text image_url:string price:decimal

I then raked that:

rake db:migrate

Once that was run, I went into the db/seeds.db file and filled this newly created table with this data:

Product.delete_all
Product.create(:title => 'Web Design for Developers',
               :description => 
               %{<p>
               <em>Web Design for Developers</em> will show you how to make your
               web-based application look professionally designed. We'll help you
               learn how to pick the right colors and fonts, avoid costly interface
               and accessibility mistakes -- your application will really come alive.
               We'll also walk you through some common Photoshop and CSS techniques
               and work through a web site redesign, taking a new design from concept
               all the way to implementation.
               </p>},
               :image_url =>   '/images/rails.png',    
               :price => 42.95)
# . . .
Product.create(:title => 'Programming Ruby 1.9',
               :description =>
               %{<p>
               Ruby is the fastest growing and most exciting dynamic language
               out there. If you need to get working programs delivered fast,
               you should add Ruby to your toolbox.
               </p>},
               :image_url => '/images/rails.png',
               :price => 49.50)
# . . .

Product.create(:title => 'Rails Test Prescriptions',
               :description => 
               %{<p>
               <em>Rails Test Prescriptions</em> is a comprehensive guide to testing
               Rails applications, covering Test-Driven Development from both a
               theoretical perspective (why to test) and from a practical perspective
               (how to test effectively). It covers the core Rails testing tools and
               procedures for Rails 2 and Rails 3, and introduces popular add-ons,
               including Cucumber, Shoulda, Machinist, Mocha, and Rcov.
               </p>},
               :image_url => '/images/rails.png',
               :price => 43.75)

Once again, I raked this data:

rake db:seed

After this was all complete, I loaded up localhost:3000/products and everything was working fine. However, the book wanted to add some css code to make things look a bit better. Once I added the CSS (exactly as the book had it), I got an error when I loaded localhost:3000/products (error: http://postimage.org/image/3qfpta4w7/ ). I assume my error has something to do with my css, but I do not know what to do. Here is my css:

.products {
table {
border-collapse: collapse;
}
table tr td {
    padding: 5px;
    vertical-align: top;
}
.list_image {
    width: 60px;
    height: 70px;
 
}
.list_description {
    width: 60%;
dl {
margin: 0;
}
dt {
    color: #244;
    font-weight: bold;
    font-size: larger;
}
dd {
    margin: 0;
}
}
.list_actions {
    font-size: x-small;
    text-align: right;
    padding-left: 1em;
}
.list_line_even {
    background: #e0f8f8;
}
.list_line_odd {
    background: #f8b0f8;
}
}

I have tried changing several things, but now success has followed. Any and all input on this would be appreciated. (PS bonus points for naming your favorite rails book to learn from).

Answer 1

Check following

  .products {
        table {
            border-collapse: collapse;
        }
        table tr td {
            padding: 5px;
            vertical-align: top;
        }
        .list_image {
            width: 60px;
            height: 70px;
        }
        .list_description {
            width: 60%;
            dl {
                margin: 0;
            }
            dt {
                color: #244;
                font-weight: bold;
                font-size: larger;
            }
            dd {
                margin: 0;
            }
        }
        .list_actions {
            font-size: x-small;
            text-align: right;
            padding-left: 1em;
        }
        .list_line_even {
            background: #e0f8f8;
        }
        .list_line_odd {
            background: #f8b0f8;
        }
    }