title: Webkit marquee only scroll when necessary
body: <p>I've got a question concerning webkit marquee. I've got 2 elements of a variable width. (The 2 elements are the same width), and both elements need to be a marquee.</p>
  
  <p>However when the content has overflow (is larger then the element) I need a marquee, if not the text should remain as it is (no scrolling).</p>
  
  <p>I've created a JSFiddle as an example:
  <a href="http://jsfiddle.net/Vxwed/" rel="nofollow">http://jsfiddle.net/Vxwed/</a>:</p>
  
  <p>The long and short both need to be marquee'd through CSS3, while the long should scroll and the short one doesn't.</p>
  
  <pre><code>&lt;p class="long"&gt;Hi my name is John Doe&lt;/p&gt;
  &lt;p class="short"&gt;Yeah!&lt;/p&gt;
  </code></pre>
  
  <p>Remember, the contents of the elements are variable (filled with javascript), so I cant do actual hardcoding on the elements marquee-behaviour.</p>
  
  <p>Any CSS experts here able to help me? I've been researching this a lot but there is little information about this subject, since it's relatively new.</p>
  
  <p>The only solution that I'm able to think of right now is using jQuery to measure the width of the elements, and then calculate if they need extra spacing. If they need apply marquee, else don't. But that doesn't seem very clean to me, I'd rather do this in HTML/CSS only if possible.</p>