title: Easiest way to split an unordered list into two columns
body: <p>Is it possible to show elements of an unordered list in a two-column submenu using CSS? I want to achieve something like <a href="http://www.cssplay.co.uk/menus/pro-flyout-list.html" rel="nofollow">this</a>, but without having several <code>&lt;div&gt;</code>s in the submenu. I tried <a href="http://jsfiddle.net/S9t7Y/19/" rel="nofollow">this</a>, but I have two issues:</p>
  
  <ol>
  <li>The submenu items do not align if they are of different widths (obvious) and I would like to keep that as it is because I do not know the length of each item</li>
  <li>I cannot keep the top menu selected when hovering over it</li>
  </ol>
  
  <p>How can I fix these issues?</p>