This is mostly a challenge to myself. I can generally determine when an image is necessary (or a good idea). As this isn’t a logo or a re-used element, I wanted to try to create it using CSS. I don’t have any issue with using triangles, but couldn’t figure out how to get the white/yellow border without using a bunch of extra elements, which isn’t a big deal, I guess.
If anyone knows how to create this using skew(), I’d be really interested in reviewing. That’s one css3 property I haven’t used a whole lot.