title: Html/css position inner ul to outer ul
body: <p>I'm having some trouble with html/css positioning in what is some sort of a menu.
  I have a ul element with a number of child li elements. Each of these li elements contains another ul element. So for example there is something like this:</p>
  
  <pre><code>&lt;ul class="level0"&gt;
  &lt;li id="nav-1-1" class="level1"&gt;&lt;span&gt; Option1 &lt;/span&gt;
  &lt;ul id="submenu" class=""&gt;
      &lt;li class="level2" first="" nav-2-2=""&gt;
      &lt;li class="level2" first="" nav-2-2=""&gt;
      &lt;li class="level2" first="" nav-2-2=""&gt;
  &lt;/ul&gt;
  &lt;/li&gt;
  &lt;li id="nav-1-1" class="level1"&gt;&lt;span&gt; Option2 &lt;/span&gt;
  &lt;ul id="submenu" class=""&gt;
      &lt;li class="level2" first="" nav-2-2=""&gt;
      &lt;li class="level2" first="" nav-2-2=""&gt;
      &lt;li class="level2" first="" nav-2-2=""&gt;
  &lt;/ul&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p></p>
  
  <p>This is just an example.
  What I would like is to position the inner ul element to the outer, and not the li. How can this be done? Thanks in advance.</p>