Star (5-points)


SUBMITTED BY: Guest

DATE: March 5, 2013, 8:52 a.m.

FORMAT: CSS

SIZE: 1.4 kB

HITS: 1203

  1. #star-five {
  2. margin: 50px 0;
  3. position: relative;
  4. display: block;
  5. color: red;
  6. width: 0px;
  7. height: 0px;
  8. border-right: 100px solid transparent;
  9. border-bottom: 70px solid red;
  10. border-left: 100px solid transparent;
  11. -moz-transform: rotate(35deg);
  12. -webkit-transform: rotate(35deg);
  13. -ms-transform: rotate(35deg);
  14. -o-transform: rotate(35deg);
  15. }
  16. #star-five:before {
  17. border-bottom: 80px solid red;
  18. border-left: 30px solid transparent;
  19. border-right: 30px solid transparent;
  20. position: absolute;
  21. height: 0;
  22. width: 0;
  23. top: -45px;
  24. left: -65px;
  25. display: block;
  26. content: '';
  27. -webkit-transform: rotate(-35deg);
  28. -moz-transform: rotate(-35deg);
  29. -ms-transform: rotate(-35deg);
  30. -o-transform: rotate(-35deg);
  31. }
  32. #star-five:after {
  33. position: absolute;
  34. display: block;
  35. color: red;
  36. top: 3px;
  37. left: -105px;
  38. width: 0px;
  39. height: 0px;
  40. border-right: 100px solid transparent;
  41. border-bottom: 70px solid red;
  42. border-left: 100px solid transparent;
  43. -webkit-transform: rotate(-70deg);
  44. -moz-transform: rotate(-70deg);
  45. -ms-transform: rotate(-70deg);
  46. -o-transform: rotate(-70deg);
  47. content: '';
  48. }

comments powered by Disqus