title: Hiding SPAN Overflow
body: <p>I am trying to create a combobox style widget (jquery-ui compatible) andcurrently I am trying to get the static layout of the box sorted. The problem is when I have long text in the value area of the select it doesn't clip in Firefox (it actually wraps).  I don't want this and tried various combinations overflow:hidden white-space:nowrap etc but in Firefox it still wraps.  The sample code is below.</p>
  
  <pre><code>&lt;a href="#" class="ui-widget ui-widget-content ui-custom-button ui-state-default ui-corner-all ui-helper-reset" style="padding-left:5px;text-decoration: none; width: 139px; "&gt;
      &lt;span style="float:right;margin-top:1px;border-left:1px solid #D3D3D3;" class="ui-custom-button-icon ui-icon ui-icon-triangle-1-s" &gt;&lt;/span&gt;
      &lt;span style="line-height:1.5em;font-size:10px;margin-top:1px;overflow:hidden;height:16px;"&gt;If the text is very long then somethin&lt;/span&gt;
  &lt;/a&gt;
  </code></pre>
  
  <p>Can anyone offer any help on this?</p>