title: Customizing border properties using zigzag edges
body: <p>I am trying to create a web page that looks like like in this site:</p>
  
  <p><a href="http://dribbble.com/shots/805937-Minimalist-invoice" rel="nofollow">http://dribbble.com/shots/805937-Minimalist-invoice</a></p>
  
  <p>Overview of why I need the design to be static:
  I am trying to create a website that has the same concept as that of an ecommerce website. So every time I update a new item on my list, it will be displayed inside a table and so on.</p>
  
  <p>I tried creating an image with that design using photoshop(the one in the middle with a white background and pointy edges on the top and bottom) but the result is that the image is static and does not dynamically change when the content of the page changes.</p>
  
  <p>I do not know if I can implement the design by customizing the borders using pure HTML code.</p>
  
  <p>I tried using the image-border property of CSS, but it still has horizontal borders on the edges. I also used the background image property, but the result is that it is static and does not change when an update in the items changes. </p>
  
  <p>Thanks for all the help.</p>