Tags
- CSS (11)
- Design (7)
- HTML (7)
- Inspiration (6)
- Links Roundup (6)
- Typography (6)
- illustration (6)
- Creativeness (5)
- Development (4)
- Javascript (4)
- View all 69 tags
- Links (3)
- Tutorial (3)
- Markup (2)
- Minimalist (2)
- Tips (2)
- Vintage (2)
- Xmas (2)
- jQuery (2)
- progressive enrichment (2)
- retro (2)
- Badge (1)
- Bookmarklet (1)
- Cards (1)
- Christmas (1)
- DOM (1)
- Date (1)
- Drop Caps (1)
- Illustrator (1)
- Link (1)
- PHP (1)
- Pizza by the slice (1)
- Redesign (1)
- Roy Doty (1)
- Twitter (1)
- UI (1)
- UX (1)
- Vector (1)
- Wordpress (1)
- accessibility (1)
- adjacent sibling selector (1)
- animation (1)
- barack (1)
- bug (1)
- clearfix (1)
- collage (1)
- color (1)
- css 3 (1)
- easy-clearing (1)
- election (1)
- form (1)
- group (1)
- halloween (1)
- ie7 (1)
- image editor (1)
- label (1)
- obama (1)
- photoshop (1)
- portfolio (1)
- progressive enhancement (1)
- pumpkin (1)
- rgba (1)
- roundup (1)
- scroll (1)
- spooky (1)
- steampunk (1)
- tools (1)
- tooltip (1)
- webkit (1)
- yes we can (1)
Archive
February 7th, 7:56am
0 comments
CSS Tooltip
Here is how to create a very basic tooltip using only CSS. I've been using this technique all over my latest project.
Let's start by creating the following markup:
Markup
CSS
As I mentioned in a previous article, IE doesn't support RGBa. Adding the following styles, wrapped in a conditional comment, will make it work.
IE CSS
For more info about creating speech bubble using only CSS, go to DeSandro's tutorial on creating speech bubble.
