I have a history of learning how to round – up corners using CSS to Javascript.  But I’m not saying I’m an expert to any of these fields (namely CSS and Javascript). It just happens that my previous job has provided me enough space and opportunity to learn some techniques and skills on these area. (Thanx to Sir Troy for that)

Ive gone from using tables plus external images (atleast four) to generate a container with round corners. (a primitive way i think). This was the time where tables are the mainstream for layouting your page.

Then come the tableless layout using div. It was a remarkable alternative from layouting webpages. Using tables are messy (code-wise) and ugly. Div’s are seamless and with CSS positioning and all that, div is the way to go for layout.

I adapted how rockettheme.com layouts their template by superimposing atleast three divs on top of each other and positioning these div’s in such a way that any of them can take the left, center, and right part of a rounded rectangle as a background image.

Soon, since I always look for better alternatives, I discovered nifty corners  and my quest for rounded corners finally ended. 😀

I love the library of nifty corners. Easy, light and direct.

I never had a problem with it until I have to make a site with background gradients and rounded corners and I opted not to use the (sliding doors of css by alistapart.com) on my tabs. Simply because I am in no mood to reconsider all the prerequisites of a sliding doors of css  (the background images for the left and the sliding door side).

I looked for js libs that could create the bg gradient for me. But found nothing that suits my taste. So after an hour of searching and trying, I gave up and went back to images. Surely, a single background gradient from an external image will not be that hard to load compared to the (3 images from rockettheme’s style).

And then i tried if i could use nifty corners to round up the top of my div, and a single image file (gradient) as bg image for that div and voila! It worked…

I have yet to see if i could mimic the sliding doors though. 😀

it’s my task for the coming night. 😀