Posted By

LeeRJohnson on 01/04/08


Tagged

css icon microformat hCalendar dstart iCalendar


Versions (?)

Who likes this?

2 people have marked this snippet as a favorite

SpinZ
brent-man


hCalendar dstart Icon


 / Published in: HTML
 

URL: http://design.leerjohnson.com/hCalender-examples.html

Visit URL for samples.

  1. #CalenderIcons .dtstart{
  2. display:block;
  3. float:left;
  4. min-width:4em;
  5. text-align:center;
  6. border-left:solid .05em #666;
  7. border-right:solid .05em #666;
  8. border-top:dotted .1em #666;
  9. border-bottom:solid .2em #666;
  10. font-family: courier new;
  11. }
  12. #CalenderIcons .dtstart .month{
  13. display:block;
  14. background:#f00;
  15. color:#fff;
  16. font-weight:bolder;
  17. text-transform:uppercase;
  18.  
  19. }
  20. #CalenderIcons .dtstart .day{
  21. display:block;
  22. background:#fff;
  23. color:#333;
  24. font-weight:bolder;
  25. font-size:3em;
  26. line-height:1em;
  27. }
  28. #CalenderIcons .dtstart .year{
  29. display:block;
  30. background:#ccc;
  31. color:#333;
  32. font-weight:bolder;
  33. font-size:.8em;
  34. line-height:1.2em;
  35. }
  36.  
  37. <abbr class="dtstart" title="2000-01-31">
  38. <abbr class="month" title="January">Jan</abbr>
  39. <span class="day">31</span>
  40. <span class="year">2000</span>
  41. </abbr>

Report this snippet  

You need to login to post a comment.