title: Text-decoration: none not working
body: <p>Totally baffled! I've tried rewriting the <code>text-decoration: none</code> line several different ways. I also managed to re-size the text by targeting it but the <code>text-decoration: none</code> code will not take.</p>
  
  <p>Help much appreciated.</p>
  
  <p>Code</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.widget    
  {
       height: 320px;
       width: 220px;
       background-color: #e6e6e6;
       position: relative;                              
       overflow: hidden;                          
  }
  
  
  .title    
  {
       font-family: Georgia, Times New Roman, serif;
       font-size: 12px;
       color: #E6E6E6;
       text-align: center;
       letter-spacing: 1px;
       text-transform: uppercase;
       background-color: #4D4D4D;    
       position: absolute;
       top: 0;
       padding: 5px;
       width: 100%;
       margin-bottom: 1px;
       height: 28px;
       text-decoration: none;
  }
  
  a .title    
  {
       text-decoration: none;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;a href="#"&gt;
      &lt;div class="widget"&gt;  
          &lt;div class="title"&gt;Underlined. Why?&lt;/div&gt;  
      &lt;/div&gt;
  &lt;/a&gt;</code></pre>
  </div>
  </div>
  </p>