title: Overlay bootstrap div row
body: <p>I'm using Bootstrap, I have a registration form. When register button is clicked, I call ajax to send the form. While remote page is executing, I'd like to overlay the form with a div with a message like "Please wait" How can I overlay the row with exact size. 
  This is my form:</p>
  
  <pre><code>&lt;div class="row"&gt;
  &lt;div class="col-xs-12 col-sm-8 col-md-6 col-sm-offset-2 col-md-offset-3"&gt;
      &lt;form id="forminscr" method="post"&gt;
          &lt;h2&gt;Registration &lt;small&gt;&lt;/small&gt;&lt;/h2&gt;
          &lt;hr class="colorgraph"&gt;
          &lt;div class="row"&gt;
              &lt;div class="col-xs-12 col-sm-6 col-md-6"&gt;
                  &lt;div class="form-group"&gt;
                      &lt;input type="text" name="name" id="name" class="form-control input-lg" placeholder="Name" tabindex="1"&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="col-xs-12 col-sm-6 col-md-6"&gt;
                  &lt;div class="form-group"&gt;
                      &lt;input type="text" name="surname" id="surname" class="form-control input-lg" placeholder="Surname" tabindex="2"&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="form-group"&gt;
              &lt;input type="text" name="company" id="company" class="form-control input-lg" placeholder="Company" tabindex="3"&gt;
          &lt;/div&gt;
          &lt;div class="form-group"&gt;
              &lt;input type="email" name="email" id="email" class="form-control input-lg" placeholder="Adresse email" tabindex="4"&gt;
          &lt;/div&gt;
          &lt;div class="row"&gt;
              &lt;div class="col-xs-12 col-sm-6 col-md-6"&gt;
                  &lt;div class="form-group"&gt;
                      &lt;input type="password" name="mdp" id="mdp" class="form-control input-lg" placeholder="Mot de passe" tabindex="5"&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="col-xs-12 col-sm-6 col-md-6"&gt;
                  &lt;div class="form-group"&gt;
                      &lt;input type="password" name="mdp2" id="mdp2" class="form-control input-lg" placeholder="Confirmer" tabindex="6"&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;hr class="colorgraph"&gt;
          &lt;div class="row"&gt;
              &lt;div class="col-xs-12 col-md-6"&gt;&lt;input type="submit" value="Register" class="btn btn-primary btn-block btn-lg" tabindex="7"&gt;&lt;/div&gt;
              &lt;div class="col-xs-12 col-md-6"&gt;&lt;a href="connexion.php" class="btn btn-success btn-block btn-lg"&gt;Login&lt;/a&gt;&lt;/div&gt;
          &lt;/div&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p><a href="http://jsfiddle.net/stjyjgmb/" rel="nofollow">http://jsfiddle.net/stjyjgmb/</a></p>