title: CSS Challenge: INPUT going outside of DIV
body: <p>I'm trying to accomplish something specific around platform constraints I'm under. </p>
  
  <p>I created a somewhat self-explanatory jsfiddle of the problem at <a href="http://jsfiddle.net/MrV5M/4/" rel="nofollow">http://jsfiddle.net/MrV5M/4/</a></p>
  
  <p>The specific problem:</p>
  
  <ul>
  <li>On Chrome, the right border of the input box is cut off.</li>
  <li>On Safari, the width of the content class cell exceeds the container so it spills over the border.</li>
  <li>On IE9, the label doesn't float to the left of the content div</li>
  </ul>
  
  <p>The main reason I care about Safari is because I'm working on a JQuery Mobile/PhoneGap app which is also a web app.  I'm only supporting modern browsers, but this is driving me nuts.  Normally I'd just use a table for the container, but the text-overflow: ellipsis styles on the content div don't work when inside a table.  (Basically, I'm trying to keep the content to a single line and have ellipsis without enforcing a fixed width or calculating a width with Javascript)</p>
  
  <p>Anyone have the l33t CSS skills to make this work?  I sure don't...  :)</p>