title: position of recaptcha on bootstrap
body: <p>I'm trying to align recaptcha box with input fields using bootstrap. I used this code on ckeditor. The position of recaptcha changed when the time out for captcha was display. How to keep the position of recaptcha box same even after display error? </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.g-recaptcha {
      margin-left: -1px!important;
      margin-top: -50px
  }
  width: 300px; !important;
  .captcha{
   margin-left:7px;
   margin-top:-47px!important;
  }
  .recaptcha-wrap {
   position:relative;
   height:76px;
   padding:1px 0 0 1px;
   background:#222;
  &gt;div{
   position:absolute;
   bottom: 2px;
   right:2px;
   font-size:10px;
   color:#ccc;
   }
  }
  width: 300px; !important;
  .captcha{
   margin-left:7px;
   margin-top:-47px!important;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src='https://www.google.com/recaptcha/api.js'&gt;&lt;/script&gt;
      &lt;link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css"&gt;
      &lt;link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css"&gt;
  &lt;form class="well form-horizontal" action=" " method="post" 
      id="contact"&gt;
    
    &lt;div class="form-group"&gt;
  &lt;div class="col-md-8 inputGroupContainer"&gt;
  &lt;div class="input-group required"&gt;&lt;span class="input-group-addon"&gt;&lt;i class="glyphicon glyphicon-envelope" &gt;&lt;/i&gt; &lt;/span&gt; &lt;input class="form-control" id="email" name="email" placeholder="Email" type="text" value="" /&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
    
  &lt;div class="form-group"&gt;
  &lt;div class="col-md-8 inputGroupContainer"&gt;
  &lt;div class="input-group required"&gt;&lt;span class="input-group-addon"&gt;&lt;i class="glyphicon glyphicon-user" &gt;&lt;/i&gt; &lt;/span&gt; &lt;input class="form-control" id="name" name="name" placeholder="Name" type="text" value="" /&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="form-group"&gt;
  &lt;div class="col-md-8 inputGroupContainer"&gt;
  &lt;div class="input-group"&gt;&amp;nbsp;&lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="form-group"&gt;
  &lt;div class="col-md-8 inputGroupContainer"&gt;
  &lt;div class="input-group captcha"&gt;&lt;input data-error="Check `I am human` !" id="recaptchaValidator" name="recaptcha" pattern="1" required="" style="visibility: hidden" type="text" value="" /&gt;
  &lt;div class="g-recaptcha" data-callback="test" data-sitekey="6Lc7vh8UAAAAAEkcVjo-Cz5rOKSmE22V7x8-0MXP" name=""&gt;&amp;nbsp;&lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
          
     
   &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>