Building a CSS3 Compass
Creating a neat little CSS Compass can be quite easy and fun.
Some things to note:
For the pointer I simply used a div with linear-gradient and applied the skewX transformation on it, all using CSS3. Neat trick, eh?
The skewing did not work properly on the element itself so I applied it to the
Rotation of the pointer is simple CSS3
Gloss is achieved with linear-gradient on the main element's
Directions have been all positioned absolutely.
Lets do it!