title: Why TD width is not working or not followed?
body: <p><strong>Original question: Does HTML <code>&lt;table&gt;</code> have a default width?</strong></p>
  
  <p>Recently someone asked a question somewhere along these lines, and got me wondering.</p>
  
  <p>Take this for example. </p>
  
  <p><a href="http://jsfiddle.net/rqmNY/1/" rel="noreferrer">http://jsfiddle.net/rqmNY/1/</a></p>
  
  <p>In this fiddle, if you were to check its width (I'm using inspect element from chrome), it shows <code>100px</code>, working as intended.</p>
  
  <p>Lets add a few more "td"s in, and we shall see that the "<code>td:100px</code>" css is being ignored.</p>
  
  <p><a href="http://jsfiddle.net/rqmNY/2/" rel="noreferrer">http://jsfiddle.net/rqmNY/2/</a></p>
  
  <p>As you can see, now it's 83px instead of <code>100px</code> as originally intended.</p>
  
  <p>But let's say, I move back to fewer TD's (7), and I add in a wider width to each TD element (500px), the result is that the width of the td gets stuck at <code>119px</code>.</p>
  
  <p><a href="http://jsfiddle.net/rqmNY/6/" rel="noreferrer">http://jsfiddle.net/rqmNY/6/</a></p>
  
  <p>And finally, let's say I have a table of 2000px width, and td of <code>100px</code> width, and many td elements.
  <a href="http://jsfiddle.net/rqmNY/7/" rel="noreferrer">http://jsfiddle.net/rqmNY/7/</a></p>
  
  <p>Now the table width overrides the TD width, and expands the td's width to <code>222px</code>.</p>
  
  <p>Can anyone explain this behavior?</p>
  
  <p>p.s. Note that in all cases, inspect element tool tells me that the width is always corresponding to the css, it's just the final result not showing correctly.</p>