title: <td style="width"> attribute works inline but not in external stylesheet
body: <p>I'm trying to use external css to format a 3-column table with 100% width and column widths of 10%, 80%, and 10% respectively. All my td attributes work from the external stylesheet except width. </p>
  
  <pre><code>&lt;td style="width:10%"&gt;
  </code></pre>
  
  <p>works in inline css, but not as an internal style or from the external stylesheet.
  It will read td widths from the external css if I remove the 100% width attribute from the table, but then the width of my table changes depending on the amount of text in it.
  I have tried using </p>
  
  <pre><code>table-layout: fixed;
  </code></pre>
  
  <p>with no success. I've also tried removing width from one column at a time with no effect. All the examples I can find use pixels instead of % widths.</p>
  
  <p>Have I missed something simple about table design?</p>
  
  <p>Here's the relevant part of my external css:</p>
  
  <pre><code>table.border td {
      border-width: 5px;
      padding: 10px;
      border-style: ridge;
      border-color: white;
      border-collapse: collapse;
      -moz-border-radius: 0px 0px 0px 0px;
      vertical-align: top;
      width: 100%;
  }
  
   td.edge {
      background-color: green;
      width: 10%;
  }
    td.center{
      width: 80%;
      background-color: pink;
  }
  </code></pre>
  
  <p>and here's the table's html:</p>
  
  <pre><code>&lt;table class="border" &gt;
  &lt;tr&gt;
  &lt;td class="edge"&gt; hi there&lt;/td&gt;
  &lt;td class="center"&gt;it's me&lt;/td&gt;
  &lt;td class="edge"&gt; bye there&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>The table it gives me has a wide first column and narrow second and third columns.</p>