title: Fixed div vertically and right aligned to another div
body: <p>The nav div must be fixed vertically and sitting to the right side of container div. </p>
  
  <p>Using <code>position:fixed;</code> and setting values left and top, you get the div to stay in the same place, but the left value depends since the parent div (page-container) gets centered.</p>
  
  <pre><code>&lt;html&gt;
  &lt;body&gt;
  &lt;div id="page-container" style="width: 700px; height:1000px; margin-left: auto; margin-right: auto;background-color:moccasin;"&gt; 
  
      &lt;div class="content" style=" width: 340px; height:300px; float:left;background-color:mediumseagreen;"&gt; 
          .content
      &lt;/div&gt;
  
      &lt;div class="nav" style="float:left;height: auto; width: 300px; display: block;background-color:lightblue;"&gt; 
          .nav &lt;br&gt;&lt;br&gt;This div must:&lt;br&gt; 
       1. be fixed vertically (if scrolling down, you should see me in the same place) &lt;br&gt;
       2. be aligned to the right side of &lt;b&gt;content&lt;/b&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/0Esv7.jpg" alt="enter image description here"></p>