title: Shapes in emails - a good practice?
body: <p>I'm sending emails to my clients with voucher info. I'd like to graphically represent a voucher.</p>
  
  <p>I came up with an idea to style tables (as tables are well recieved in email clients)  - check code snippet for my solution.</p>
  
  <p>I do not want to go for images, since they are disabled by default in most email clients.</p>
  
  <blockquote>
    <p>My question being: is it well recieved by mail clients and programs or should I refrain from such practice?</p>
  </blockquote>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code> #badge-ribbon { 
     position: relative; 
     background: red; 
     height: 100px; width: 100px; 
     -moz-border-radius: 50px; 
     -webkit-border-radius: 50px; 
     border-radius: 50px; 
   } 
  #badge-ribbon:before, #badge-ribbon:after { 
    content: ''; 
    position: absolute; 
    border-bottom: 70px solid red; 
    border-left: 40px solid transparent; 
    border-right: 40px solid transparent; 
    top: 70px; 
    left: -10px; 
    -webkit-transform: rotate(-140deg); 
    -moz-transform: rotate(-140deg); 
    -ms-transform: rotate(-140deg); 
    -o-transform: rotate(-140deg); } 
  #badge-ribbon:after { 
    left: auto; 
    right: -10px; 
    -webkit-transform: rotate(140deg); 
    -moz-transform: rotate(140deg); 
    -ms-transform: rotate(140deg); 
    -o-transform: rotate(140deg); 
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code> &lt;table id="badge-ribbon"&gt;</code></pre>
  </div>
  </div>
  </p>