title: css issue li in same line 50% of width
body: <p><a href="http://liveweave.com/BNM1Jj" rel="nofollow">http://liveweave.com/BNM1Jj</a></p>
  
  <p>I try to put both li element in same line occupying 50% of width but i could not get them in same line</p>
  
  <p>i do not want to use table structure .</p>
  
  <p>unable to put both li in same line why so ??</p>
  
  <pre><code>ul.primary_nav{
      background-color:#494949;
  }
  
  ul.primary_nav li.selected{
      background-color:#942F99;
      color:#494949;    float:left;
  }
  
  ul.primary_nav li{
      display:inline-block;
      padding-top:5px;padding-bottom:5px;
      width:50%;
  
  }
  ul.primary_nav li a{
      display:block;
      height:36px;
      text-align:center;
      color:#c5c5c5;
      font-size:13px;
      text-shadow:0px 1px 0px #2a2a2a;
      text-decoration:none;
      font-weight:bold;
  }
  ul.primary_nav li a span.icon{
      display:block;
      margin:auto;
      width:22px;
      height:22px;
  }
  </code></pre>
  
  <p>please tell what i am missing</p>