title: Chrome inline-block not working
body: <p>I am trying to create a basic HTML page layout. The code is working fine in latest version of the firefox, but not in chrome(v31).
  The Problem: Chrome inserts a line break after the second div. Is this a chrome bug or my code is wrong? If it is a chrome bug then what is the workaround or fix?</p>
  
  <pre><code>&lt;div class="div-1"&gt;&lt;/div&gt;&lt;div class="div-2"&gt;&lt;/div&gt;&lt;div class="div-3"&gt;
      &lt;form&gt;
          &lt;fieldset&gt;
              &lt;label for="uid"&gt;Email&lt;/label&gt;
              &lt;input type="email" id="email" placeholder="Email"&gt;
  
              &lt;label for="password"&gt;Password&lt;/label&gt;
              &lt;input type="password" id="password" placeholder="Password"&gt;
  
              &lt;input type="submit" value="Sign In"&gt;
          &lt;/fieldset&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>stylesheet</p>
  
  <pre><code>@import url("reset.css");
  .div-1 {
  background-color: green;
  height:30px;
  width: inherit;
  }
  
  .div-2 {
  background-color: red;
  height: 275px;
  width: 752px;
  display: inline-block;
  }
  
  .div-3 {
  background-color: blue;
  height: auto;
  width: 255px;
  vertical-align: top;
  display: inline-block;
  float: right;
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/ajinkya4649/gxQKt/" rel="nofollow">FIDDLE</a></p>