I am perfectly aware of CSS image replacement techniques for navigation, I just haven’t seen it angled like that where the anchor tag wraps perfectly around the link, as far as I have always understood it when replacing an anchor text with an image you have to specify a width and height for that image, so on an angled image the dimensions of the anchor tag wouldn’t wrap it perfectly, they would be wider, if that makes sense. I just wasn’t sure how they did image replacement, tilted the images and still had the anchor wrap perfectly around the element so there’s no extra anchor spacing on either side of the graphic.
It’s still a rectangle. I would recommend either using Firebug or Chrome’s built in developer tools to get an idea of how this is being accomplished. It’s not perfectly wrapped around the text, it’s just really tight to it.
Yeah they use image sprites, first time I have heard of that being classified as doing it “fake” but as has already been mentioned CSS transform will do the same thing without images, just not going to work completely cross-browser.
And flag rahul for his horrible design advice ..also spam. ;)
Yea – You can use CSS Transform for cool effects like that – best thing about the CSS transform is that in versions of IE and other non-compatible browsers it just dosen’t transform so it’s just not slanted :)