All Annotations of 53 CSS-Techniques You Couldn’t Live Without | Smashing Magazine[Preview]

saved by311 people, first byJohn Anthony Hartman on 2007-01-18, last bycamac zu on 2008-08-15

• 
• 53 CSS-Techniques You Couldn’t Live Without

• 53 CSS-Techniques You Couldn’t Live Without

  
  

  January 19th, 2007

• Below you’ll find a list of techniques we , as web-architects, really couldn’t live without. They are essential and they indeed make our life easier.
• 53 CSS-based techniques you should always have ready to hand if you develop web-sites
• 53 CSS-Techniques You Couldn’t Live Without
• 53 CSS-Techniques You Couldn’t Live Without
• 53 CSS-Techniques You Couldn’t Live Without
• Let’s take a look at 53 CSS-based techniques you should always have ready to hand if you develop web-sites.

• 1. CSS Based Navigation

  
  

  

  
  

  2. Navigation Matrix Reloaded

  
  

  

  
  

  3. CSS Tabs

  
  

  

  
  

  4. CSS Bar Graphs (CSS For Bar Graphs)

  
  

  

  
  

  5. Collapsing Tables: An Example

  
  

  

  
  

  6. Adam’s Radio & Checkbox Customisation Method

  
  

  

  
  

  7. CSS Image Replacement

  
  

  

  
  

  8. CSS Shadows (CSS Shadows Roundup)

  
  

  

  
  

  9. CSS Rounded Corners Roundup (Nifty Corners)

  
  

  

  
  

  10. Drop Cap - Capital Letters with CSS

  
  

  

  
  

  11. Define Image Opacity with CSS

  
  

  

  
  

  12. How to Create a Block Hover Effect for a List of Links

  
  

  

  
  

  13. Pullquotes with CSS (Automatic Pullquotes with JavaScript and CSS

  
  

  

  
  

  14. CSS Diagrams

  
  

  

  
  

  15. CSS Curves

  
  

  

  
  

  16. Footer Stick allows for the footer of a Web page to appear either at the bottom of the browser window or the bottom of the Web page content – whichever is visually lowest.

  
  

  

  
  

  17. CSS Image Map

  
  

  

  
  

  18. CSS Image Pop-Up

  
  

  

  
  

  19. CSS Image Preloader

  
  

  

  
  

  20. CSS Image Replacement for Buttons

  
  

  

  
  

  21. Link Thumbnail

  
  

  

  
  

  22. CSS Map Pop

  
  

  

  
  

  23. PHP-based CSS Style Switcher

  
  

  

  
  

  24. CSS Unordered List Calender (CSS Styled Calender)

  
  

  

  
  

  25. CSS-Based Forms: Techniques

  
  

  

  
  

  26. CSS-Based Tables: Techniques

  
  

  

  
  

  27. Printing Web-Documents and CSS

  
  

  

  
  

  28. Improved Links-Display for Print-Layouts with CSS

  
  

  

  
  

  29. CSS-Submit Buttons

  
  

  

  
  

  30. CSS Teaser Box

  
  

  

  
  

  31. CSS Tricks for Custom Bullets

  
  

  

  
  

  32. Ticked Off Links Reloaded

  
  

  

  
  

  33. CSS Zooming

  
  

  

  
  

  34. Creating a Star Rater using CSS

  
  

  

  
  

  35. The ways to style visited Links

  
  

  

  
  

  36. PDF, ZIP, DOC Links Labeling

  
  

  

  
  

  37. Displaying Percentages with CSS

  
  

  

  
  

  38. Image Floats without the Text Wrap

  
  

  

  
  

  39. Let visitors decide, whether or not will they open link in a new window

  
  

  

  
  

  40. Simple accessible external links

  
  

  

  
  

  41. Zebra Table with JavaScript and CSS

  
  

  

  
  

  42. Vertical Centering with CSS (Horizontal and Vertical Centering with CSS

  
  

  

  
  

  43. Unobtrusive Sidenotes

  
  

  

  
  

  44. Image Caption with CSS (Styled Images with Caption)

  
  

  

  
  

  45. Dynamic Piechart with CSS

  
  

  

  
  

  46. Format Footnotes with CSS

  
  

  

  
  

  47. Hierarchical Sitemap with CSS

  
  

  

  
  

  48. Snook’s Resizable Underlines

  
  

  

  
  

  49. Switchy McLayout: An Adaptive Layout Technique

  
  

  

  
  

  50. StyleMap: CSS+HTML Visual Sitemap

  
  

  

  
  

  51. Custom Reading Width

  
  

  

  
  

  52. CSS Alert Message

  
  

  

  
  

  53. CSS Production Notes

  
  

  

• 

• on 2007-01-19 Abracadabra
  CSS tips and tricks
• on 2007-01-23 Mangal
  Great CSS Styles reference
• on 2007-01-25 Nitram079
  This post is amazing! If CSS is in any way an issue for you, don't miss this one!
  
• on 2007-01-28 Di_tri_nel
  Excellent resource for CSS tricks
  
• on 2007-02-03 Ycc2106
  Below you’ll find a list of techniques we , as web-architects, really couldn’t live without. They are essential and they indeed make our life easier.