title: FancyBox inside a html form
body: <p>I have a normal html form. Inside the form I have several fields. Inside that form I ALSO have a lightbox div. Inside the light box i have a submit button. So it looks something like this:</p>
  
  <pre><code>&lt;form action="path" method="post"&gt;
      Name: &lt;input type="text" name="name" /&gt;&lt;br/&gt;
  
      &lt;a href="#fancybox"&gt;Link to open fancybox&lt;/a&gt;
  
      &lt;div id="fancybox" style="display: none;"&gt;
          &lt;input type="text" name="captcha" /&gt;
          &lt;input type="submit" value="Submit" /&gt;
      &lt;/div&gt;
  
  &lt;/form&gt;
  </code></pre>
  
  <p>When I click on the link to open the fancy box and click the submit button. It doesn't work. The form isn't submitted.</p>
  
  <p>Any ideas whats going on?
  here is a jsfiddle of the situation <a href="http://jsfiddle.net/aZDZX/4/" rel="nofollow">JsFiddle</a></p>