Skip to content

Instantly share code, notes, and snippets.

@lee-dohm
Forked from anonymous/SVG-zigzag.markdown
Last active August 29, 2015 14:11
Show Gist options
  • Save lee-dohm/f695b58f3b1ce22df28d to your computer and use it in GitHub Desktop.
Save lee-dohm/f695b58f3b1ce22df28d to your computer and use it in GitHub Desktop.
<span>
<button>5 hidden comments</button>
</span>
.zig-zag {
fill: red;
}
span{
display:block;
width: 500px;
text-align: center;
background: 0 center repeat-x url('data:image/svg+xml;utf-8,<?xml version="1.0" encoding="utf-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="9px" height="6px" viewBox="0 0 9 6" enable-background="new 0 0 9 6" xml:space="preserve"><polygon class="zig-zag" opacity="1.0" points="4.5,4.5 0,0 0,1.208 4.5,5.708 9,1.208 9,0 "/></svg>');
}
button{
background: #f1f1f1;
padding: 10px;
border:0;
box-shadow: 0 0 10px 5px #f1f1f1;
}
// centering junk
html {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
}
body {
padding: 50px;
background-color: #f1f1f1;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment