title: Twitter Bootstrap - How to build form in resized browzer window?
body: <p>I'm using twitter bootstrap framework and I'm trying to build subscribe form.</p>
  
  <pre><code>&lt;div style="text-align: center; margin: 35px auto;"&gt;
          &lt;form class="form-horizontal" action="" method="post"&gt;
          &lt;input type="text" class="input-large" id="" name="" placeholder="your@email.com"&gt;
          &lt;button type="submit" class="btn btn-large" style="background-color: #88d0b0; color: white;
              border: 0;"&gt;
              Subscribe&lt;/button&gt;
          &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I need to make my text input more higher(like button), so my CSS:</p>
  
  <pre><code>input.input-large[class=input-large] {
  padding: 11px 19px;
  font-size: 17.5px;
  }
  </code></pre>
  
  <p>When browzer window is maximized, subscribe form looks good.
  <img src="https://i.stack.imgur.com/x9ylT.png" alt="enter image description here"></p>
  
  <p>But when I'm trying to resize my screen it looks like:
  <img src="https://i.stack.imgur.com/4yEFZ.png" alt="enter image description here"></p>
  
  <p>In my project I'm using CSS:bootstrap.min.css and JS:bootstrap.min.js. Also my project has following construction:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
  ....
  &lt;/head&gt;
  &lt;body&gt;
    &lt;div class="container"&gt; ..My subscribe form... &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>What I'm doing wrong?</p>