title: Anchors with overlapping divs
body: <p>I am using a grid based layout, with two main sections.  Graph and Timeline.</p>
  
  <p>Graph, contains graded vertical bars, HTML similar to:</p>
  
  <pre><code>&lt;div id="graph" class="container_160"&gt;
      &lt;div id="Jan-97" class="grid_1 major"&gt;&lt;a href="#"&gt;&amp;nbsp;&lt;/a&gt;&lt;/div&gt;
      &lt;div id="Feb-97" class="grid_1 minor"&gt;&lt;a href="#"&gt;&amp;nbsp;&lt;/a&gt;&lt;/div&gt;
      &lt;div id="Mar-97" class="grid_1 minor"&gt;&lt;a href="#"&gt;&amp;nbsp;&lt;/a&gt;&lt;/div&gt;
      &lt;div id="Apr-97" class="grid_1 minor"&gt;&lt;a href="#"&gt;&amp;nbsp;&lt;/a&gt;&lt;/div&gt;
      &lt;div id="May-97" class="grid_1 minor"&gt;&lt;a href="#"&gt;&amp;nbsp;&lt;/a&gt;&lt;/div&gt;
      etc...
  &lt;/div&gt;
  </code></pre>
  
  <p>Timeline, contains horizontal bars, HTML similar to:</p>
  
  <pre><code>&lt;div id="timeline" class="container_160"&gt;
      &lt;div id="bar1" class="grid_32 suffix_128"&gt;&lt;a href="#"&gt;&amp;nbsp;&lt;/a&gt;&lt;/div&gt;
      &lt;div id="bar2" class="prefix_32 grid_24 suffix_104"&gt;&lt;a href="#"&gt;&amp;nbsp;&lt;/a&gt;&lt;/div&gt;
      &lt;div id="bar3" class="prefix_58 grid_7 suffix_95"&gt;&lt;a href="#"&gt;&amp;nbsp;&lt;/a&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Timeline is relatively positioned to Graph so that it overlaps.  My problem is that when these divs overlap, the anchors in Timeline stop working.  I am open to both CSS and Jquery solutions.  Thanks in advance.</p>
  
  <p>t.</p>