: Clickable stickers sticking out of a notebook I'm trying to make clickable buttons that look like they're stickers sticking out of a notebook. Here's how it looks like: What's the best way

@Connie430

For the some link part, 2 solutions.
1. Make the whole an image and use CSS positioning (and if needed z-index) to position it.
2. Use a simple a href and give it a width + heigth and a background which is the image.

for the twitter facebook part.
1. CSS rotation as stated above.
2. If you really want it IE5/6 compatible it is a good idea to use a good ol fashion imagemap. If you use a HTML editor like lets say dreamweaver you can draw your clickable area from point to point.

Vote Up Vote Down

@BetL875

If browser consistency and support is important to you, using a background image is one option. You could use a transparent PNG as just the background, and use the text from your markup for the content of the tab. That way you can change the content for different tabs, but the background can be reused and since it's only one background image, the browser can reuse it for each instance of the tab on the page.

Vote Up Vote Down

@Kimberly620

This way uses CSS sprites and CSS rotation that should work on IE6 through modern browsers. It won't work on IE5 though :).

It uses CSS3Please rotation.

Vote Up Vote Down