Ajax and CSS with Rails

So the section I finished up in Agile Web Development with Rails walked me through adding Ajax functionality to the Depot shopping cart application. First I move the shopping cart into the upper left of the sidebar, then added a notification whenever an item was added to the cart without reloading the entire page. Sorcery!

However, the :blind_down visual effect I was using had some issues. Take a look:

Yuck! What are those disgusting bars doing there? Messing up my beautiful flashing green Ajax notification, that's what! There has to be a way to get rid of those. And there is!

Here's the solution. I know the Ajax notification is going off in the shopping cart table. And I know how it's styled in my depot.css file. These are pretty good clues for figuring out how to get rid of those bars. A quick Google search later and I find a little command called border-collapse.

So I just throw that into the css for the cart table:

#cart table {
  border-top: 1px dotted #595;
    ...
    border-collapse: collapse;
}

And here's the result:

Easy enough!

I find myself drawn into doing some styling whenever Agile Web Development is working on it. Styling should really be left until functionality is hammered out, but I like this approach. I like messing around with padding, margins and color schemes. On the other hand, this ties into something I had wrong about coding for a long, long time. I always kind of assumed programmers had a lot more memorized than they do. Now it's apparent that coders memorize methods they use a lot, but still have to look up quite a bit of information. The important thing is understanding how an application works, having a plan to accomplish what you want done, and knowing how to find the specific information when you need it. So in that case, yes, this DOES pertain specifically to Rails and not just CSS!

I also ran across this page while I was searching for Jquery examples. Seems like a good resource.