title: IE Font Expanding Issue
body: <p>I have asked this question before, however I was too vague (just getting used to the Stack Overflow etiquette).</p>
  
  <p>I have taken over the webmaster duties of a site that someone else created, and have run into a browser specific issue with fonts and Internet Explorer. It seems that the menu is fine in every browser but IE.  </p>
  
  <p>Below is an imgur album featuring 2 images (sorry for the blue paint, there for confidentiality I suppose). In the Firefox snapshot, the bottom navigation menu is all on the same line, however in the IE snapshot some of the text is being pushed to the second line. I am assuming this is a CSS issue, but I need to be sure.</p>
  
  <p><a href="http://imgur.com/HV4uLV8,K8uPgF4" rel="nofollow">http://imgur.com/HV4uLV8,K8uPgF4</a></p>
  
  <p>The code - the footer is a PHP include with the following code:</p>
  
  <pre><code>&lt;link href="css/newFooter.css" rel="stylesheet" type="text/css" /&gt;
  
  &lt;div id="footer_nav"&gt;
  
      &lt;ul class="footer_nav_list"&gt;
          &lt;li class="rightindent"&gt;&amp;copy;2014 My Company, LLC&amp;nbsp; &amp;nbsp; All Rights Reserved.&lt;/li&gt;           
          &lt;li&gt;&lt;a href="index.php"&gt;HOME&amp;nbsp;|&amp;nbsp;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="new-solutions.php"&gt;NEW SOLUTIONS&amp;nbsp;|&amp;nbsp;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="other-solutions.php"&gt;OTHER SOLUTIONS&amp;nbsp;|&amp;nbsp;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="support.php"&gt;SUPPORT&amp;nbsp;|&amp;nbsp;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="careers.php"&gt;CAREERS&amp;nbsp;|&amp;nbsp;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="contact.php"&gt;CONTACT US&amp;nbsp;|&amp;nbsp;&lt;/a&gt;&lt;/li&gt;            
          &lt;li&gt;&lt;a href="sitemap.php"&gt;SITEMAP&amp;nbsp;|&amp;nbsp;&lt;/a&gt;&lt;/li&gt; 
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This is linking to a CSS style-sheet with the following information:</p>
  
  <pre><code>/* STRUCTURE BEGINS */
  #footer_nav {
  background-color: #2f2f2f;
  background-image: url(../images/productsMain/footerBg.png);
  background-repeat: repeat-x;
  width: 940px;
  padding-right: 30px;
  padding-bottom: 20px;
  padding-left: 30px;
  float: left;
  }
  #footer_nav .footer_nav_list {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
  color: #999;
  list-style-type: none;
  padding-top: 35px;
  }
  #footer_nav .footer_nav_list ul {
  text-decoration: none;
  display: inline;
  list-style-type: none;
  margin-top: 15px;
  }
  #footer_nav .footer_nav_list li  {
  display: inline;
  }
  #footer_nav .footer_nav_list li a {
  color: #999;
  text-decoration: none;
  padding-top: 25px;
  padding-left: 2px;
  }
  #footer_nav .footer_nav_list li a:hover {
  color: #FFF;
  }
  #footer_nav .footer_nav_list .rightindent {
  padding-right: 25px;
  }
  </code></pre>
  
  <p>Thanks in advance!</p>