title: Unwanted word wrapping in some browsers - why is this rendered differently?
body: <p>I'm having problems with the menus of a site I'm developing. Here's what the menus look like in different browsers.</p>
  
  <p><strong>Chrome 5</strong></p>
  
  <p><img src="https://i.stack.imgur.com/vaFKw.jpg" alt="Chrome"></p>
  
  <p><strong>Opera 10</strong></p>
  
  <p><img src="https://i.stack.imgur.com/Bwcn9.jpg" alt="Opera"></p>
  
  <p><strong>Firefox 4 Beta 2</strong></p>
  
  <p><img src="https://i.stack.imgur.com/61FqU.jpg" alt="Firefox"></p>
  
  <p><strong>Internet Explorer 8</strong></p>
  
  <p><img src="https://i.stack.imgur.com/jxb4o.jpg" alt="Internet Explorer"></p>
  
  <p>The menu looks okay in Chrome, but in some browsers the little arrow is wrapped onto the next line. Additionally, in Firefox and IE the menu item overlaps with the arrow. How do I fix this?</p>
  
  <p>You can find the stylesheet, HTML sources and all that jazz here:
  <a href="http://labs.pieterdedecker.be/vspwpg/?page_id=96" rel="nofollow noreferrer">http://labs.pieterdedecker.be/vspwpg/</a></p>