title: How can i make two spans be in the same line with 'display:block' on
body: <p>I've got the following column header and i want it to be displayed like the following</p>
  <blockquote>
  <pre><code>Known allergies Peanut Ace...
  </code></pre>
  </blockquote>
  <p>ie the line shortned with ellipses.</p>
  <p>My code works but it puts one span underneathe the other when i add <code>display:block</code> to the style.</p>
  <p>it now displays like this</p>
  <blockquote>
  <pre><code>    Known allergies
  </code></pre>
  <p>Peanut Ace...</p>
  </blockquote>
  <p>How can I display it in the same line</p>
  <pre><code>&lt;th border=&quot;0&quot; &gt;
      &lt;span width=&quot;100%&quot; onclick=&quot;dropdownResize()&quot; style=&quot;padding-top:2px; white-space: nowrap; font-weight:normal;&quot;&gt;&amp;nbsp;
          &lt;i&gt;Known allergies &lt;/i&gt;&amp;nbsp;&lt;/span&gt;
      &lt;span id=&quot;allergiesSpan&quot; style=&quot;white-space: nowrap; display: block ; overflow: hidden; 
      text-overflow: ellipsis; width:50%;&quot;&gt; 
      &lt;b&gt;Peanut, Aceti test test test tes test&lt;/b&gt;&amp;nbsp;&lt;/i&gt;&lt;/span&gt;       
  &lt;/th&gt;
  </code></pre>