title: Solution to a href within a href?
body: <p>I use CSS tooltips that must be wrapped in a "a href" to work.</p>
  
  <pre><code>&lt;a href="#"&gt;
  &lt;img src="http://www.url.com/image.png" alt="" width="20" height="20" /&gt;
  &lt;span class="tooltip center white"&gt;
  &lt;img src=" http://www.url.com/image.png" alt="" width="80" height="80" /&gt;iPad [add_to_cart_anchor item="ipad"]purchase the iPad[/add_to_cart_anchor] &lt;/span&gt;
  &lt;/a&gt;
  </code></pre>
  
  <p>As you can see, I'm using "The Tooltip" and Cart66 (use of the anchor shortcode).</p>
  
  <p>It outputs as follows:</p>
  
  <pre><code>&lt;a href="#"&gt;
  &lt;img width="20" height="20" alt="" src="http://www.url.com/image.png"/&gt;
  &lt;span class="tooltip center white"&gt;
  &lt;img width="80" height="80" alt="" src=" http://www.url.com/image.png"/&gt;iPad &lt;/span&gt;
  &lt;/a&gt;
  &lt;a href="http://www.url.com/cart?task=add-to-cart-anchor&amp;amp;cart66ItemId=1"&gt;purchase the iPad&lt;/a&gt;
  </code></pre>
  
  <p>The problem is that the "purchase the iPad" is a href wrapped inside a href in code, thus it is dropped outside of the tooltip. How can I sort this out so the "purchase..." link is still within the span, hence the tooltip, whilst still allowing the tooltip to work? (I've tested without the <code>&lt;a&gt;</code> wrap and the tooltip then doesn't work at all.)</p>