Joel Stevens

I'm using Nifty Corners Cube to make all my rounded edges. It is pretty cool. It uses javascript to do it, and you do not have to mess with images. It also figures out the various backgrounds to do the transparency right. All in all, it is awesome. However, when trying to get it to work, it messed up my css, so I had to do a few fixes. Here's how I got it working:

First, copy all the javascript files into your public/javascript directory, and you won't need to worry about the css files, unlike it says you do. Then include:

<div class = "code">
<%= javascript_include_tag 'niftycube' %>

<script type="text/javascript">
    NiftyLoad=function() {
        Nifty("div.blue_container,div.code,div.inner_container,pre");
    }
</script>

In the top of the file that you want to use. Notice the div.x type syntax. Just replace the names up there with the divs you want. You can also do classes with the # sign as I recall

I also had to edit the niftycode.js sourcecode (where it finds the css) to get it to stop overwriting my css (it was screwing my fonts.

function AddCss(){
niftyCss=true;
var l=CreateEl("link");
l.setAttribute("type","text/css");
l.setAttribute("rel","stylesheet");
l.setAttribute("href","/stylesheets/niftyCorners.css");
l.setAttribute("media","screen");
document.getElementsByTagName("head")[0].appendChild(l);
}

and that's about it!