title: CSS - Keep Table Cell from Expanding and Truncate Long Text
body: <p>Can someone please tell me why this is not truncating the text? the last cell just keeps growing. I don't want cells to grow beyond their allowed percentage.</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;HTML&gt;
      &lt;TABLE id=section1 width="100%"&gt;
          &lt;TBODY&gt;
              &lt;TR style="TEXT-OVERFLOW: ellipsis; DISPLAY: table-cell; WHITE-SPACE: nowrap; FONT-SIZE: 12px; OVERFLOW: hidden;"&gt;
                  &lt;TD style="WIDTH: 8%;  TEXT-OVERFLOW: ellipsis; DISPLAY: table-cell; WHITE-SPACE: nowrap; FONT-SIZE: 12px; OVERFLOW: hidden;"&gt;COL A&lt;/TD&gt;
                  &lt;TD style="WIDTH: 18%; TEXT-OVERFLOW: ellipsis; DISPLAY: table-cell; WHITE-SPACE: nowrap; FONT-SIZE: 12px; OVERFLOW: hidden;"&gt;COL B&lt;/TD&gt;
                  &lt;TD style="WIDTH: 22%; TEXT-OVERFLOW: ellipsis; DISPLAY: table-cell; WHITE-SPACE: nowrap; FONT-SIZE: 12px; OVERFLOW: hidden;"&gt;COL C&lt;/TD&gt;
                  &lt;TD style="WIDTH: 14%; TEXT-OVERFLOW: ellipsis; DISPLAY: table-cell; WHITE-SPACE: nowrap; FONT-SIZE: 12px; OVERFLOW: hidden;"&gt;COL D&lt;/TD&gt;
                  &lt;TD style="WIDTH: 12%; TEXT-OVERFLOW: ellipsis; DISPLAY: table-cell; WHITE-SPACE: nowrap; FONT-SIZE: 12px; OVERFLOW: hidden;"&gt;COL E&lt;/TD&gt;
                  &lt;TD style="WIDTH: 10%; TEXT-OVERFLOW: ellipsis; DISPLAY: table-cell; WHITE-SPACE: nowrap; FONT-SIZE: 12px; OVERFLOW: hidden;"&gt;COL F&lt;/TD&gt;
                  &lt;TD style="WIDTH: 12%; TEXT-OVERFLOW: ellipsis; DISPLAY: table-cell; WHITE-SPACE: nowrap; FONT-SIZE: 12px; OVERFLOW: hidden;"&gt;COL G&lt;/TD&gt;
                  &lt;TD style="WIDTH: 4%;  TEXT-OVERFLOW: ellipsis; DISPLAY: table-cell; WHITE-SPACE: nowrap; FONT-SIZE: 12px; OVERFLOW: hidden;"&gt;LOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOONG&lt;/TD&gt;
              &lt;/TR&gt;
          &lt;/TBODY&gt;
      &lt;/TABLE&gt;
  &lt;/HTML&gt;
  </code></pre>
  
  <p>Here is a <a href="http://jsfiddle.net/hsmgD/" rel="nofollow">demo on jsFiddle</a></p>