title: overflow-x not working for content wrapped in td
body: <p>Is there a way to allow allow content that's wider than the screen/viewport to overflow horizontally, without disturbing the rest of the page structure? Specifically, when my content is all wrapped inside a <code>table&gt;tbody&gt;tr&gt;td</code>?</p>
  
  <p>The concept works in <a href="http://jsfiddle.net/yQEn9/" rel="nofollow">this fiddle</a>, where you see that everything is structured nicely on the page in a vertical manner, and the user can scroll horizontally in the very wide table.</p>
  
  <p>However, the same concept breaks down in <a href="http://jsfiddle.net/yQEn9/2/" rel="nofollow">this other fiddle</a>, where the screen/viewport blows up and attempts to accommodate full width of the very wide table. This is <em>undesirable</em>.</p>
  
  <p>In my final implementation, I cannot pull my content out of the outermost <code>table&gt;tbody&gt;tr&gt;td</code>, because that is beyond my control (I'm creating custom pages within Salesforce).</p>
  
  <p>I'd prefer to avoid JavaScript if at all possible, but if that's the only option I'm open to suggestions. Thank you for your time.</p>