title: Align one of several <li> to the right?
body: <pre><code>    &lt;div id="menu"&gt;
  &lt;ul&gt;&lt;li&gt;&lt;a href="#" class="current"&gt;SocialSpot&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#"&gt;Profile&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#"&gt;Latest&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#"&gt;Settings&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;Logout&lt;/li&gt;
      &lt;/div&gt;
      &lt;/ul&gt;
  </code></pre>
  
  <p>I have this in a webpage. I have css aligning them. However I want the logout button to be aligned to the right but on the same bar. How can I do this without having them all aligned to the right?</p>