title: Mottie virtual keyboard with bootstrap theme
body: <p>I am using <a href="https://github.com/Mottie/Keyboard" rel="nofollow">Mottie virtual keyboard</a> with this <a href="https://github.com/antonio-spinelli/ng-virtual-keyboard" rel="nofollow">angular wrapper</a> around it, I want to use a bootstrap theme for my keyboard and I added it like this </p>
  
  <pre><code>VKI_CONFIG.css = {
                  // input &amp; preview
                  input: 'form-control input-sm',
                  // keyboard container
                  container: 'center-block dropdown-menu', // jumbotron
                  // default state
                  buttonDefault: 'btn btn-default',
                  // hovered button
                  buttonHover: 'btn-primary',
                  // Action keys (e.g. Accept, Cancel, Tab, etc);
                  // this replaces "actionClass" option
                  buttonAction: 'active',
                  // used when disabling the decimal button {dec}
                  // when a decimal exists in the input area
                  buttonDisabled: 'disabled'
              };
  </code></pre>
  
  <p><a href="http://jsfiddle.net/Mottie/MK947/1837/" rel="nofollow">Here</a> you can find a live example of it, As I browsed demos and online examples of usage of this keyboard like <a href="https://mottie.github.io/Keyboard/docs/basic.html" rel="nofollow">here</a> and <a href="https://github.com/antonio-spinelli/ng-virtual-keyboard/blob/master/demo/index.html" rel="nofollow">here</a>, In all of them keyboard gets resized when browser windows is resized, but I don't have that behavior at all, Am I missing something here? how can I make my keyboard to get resized when I resize my browser window (with bootstrap theme)?</p>
  
  <p>Or in other words, how can I make <a href="http://jsfiddle.net/Mottie/MK947/1837/" rel="nofollow">this</a> keyboard to get resized on window resize?</p>