title: I can't position a div where I want it to go
body: <p>my html is </p>
  
  <pre><code>    &lt;h1&gt; Website &lt;/h1&gt; 
      &lt;div id="menu"&gt;
          &lt;ul&gt;
              &lt;li&gt;&lt;a href="index.html"&gt; Home&lt;/a&gt; &lt;/li&gt;
              &lt;li&gt;&lt;a href="about.html"&gt; About&lt;/a&gt; &lt;/li&gt;
              &lt;li&gt;&lt;a href="contact.html"&gt; Contact&lt;/a&gt; &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>My css is </p>
  
  <pre><code>#menu {
     margin: 0;
     padding: .3em 0 .3em 0;
     background: #ddeebb;
     width: 100%;
     text-align: center;
     float: right;
     position: absolute;
     top: 15px;
  }
  </code></pre>
  
  <p>I want my list to appear at the top right of the page. Its for a navigation bar. But instead of displaying on  top of the navigation bar, they display underneath it on the left. I dont know if this is an issue, but instead of making any css or html for a navigation bar, I just edited my webpage background to have a horizontal bar across the image and im trying to position the links on top of it. </p>