Chevron

SUBMITTED BY: Guest

DATE: March 15, 2013, 4:38 a.m.

FORMAT: CSS

SIZE: 852 Bytes

Raw Download

HITS: 1537

Report
  1. #chevron {
  2. position: relative;
  3. text-align: center;
  4. padding: 12px;
  5. margin-bottom: 6px;
  6. height: 60px;
  7. width: 200px;
  8. }
  10. #chevron:before {
  11. content: '';
  12. position: absolute;
  13. top: 0;
  14. left: 0;
  15. height: 100%;
  16. width: 51%;
  17. background: red;
  18. -webkit-transform: skew(0deg, 6deg);
  19. -moz-transform: skew(0deg, 6deg);
  20. -ms-transform: skew(0deg, 6deg);
  21. -o-transform: skew(0deg, 6deg);
  22. transform: skew(0deg, 6deg);
  23. }
  24. #chevron:after {
  25. content: '';
  26. position: absolute;
  27. top: 0;
  28. right: 0;
  29. height: 100%;
  30. width: 50%;
  31. background: red;
  32. -webkit-transform: skew(0deg, -6deg);
  33. -moz-transform: skew(0deg, -6deg);
  34. -ms-transform: skew(0deg, -6deg);
  35. -o-transform: skew(0deg, -6deg);
  36. transform: skew(0deg, -6deg);
  37. }​
comments powered by Disqus