title: Why are buttons loosing their 3d style when I change my Twitter.Bootstrap version from 2.3 to 3.0?
body: <p>I'm working on integrating Twitter.Bootstrap into a new site I'm creating and my buttons looked flat and not like the examples. After playing around with it for a bit I was able to get the 3d looking buttons by changing the style sheet and  javascript references to use an older version. </p>
  
  <p>Here's is the working code for 2.3.1</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;Bootstrap 101 Template&lt;/title&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;!-- Bootstrap --&gt;
        &lt;link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet" media="screen"/&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;h1&gt;Hello, world!&lt;/h1&gt;
        &lt;button class="btn"&gt;hello&lt;/button&gt;
      &lt;script src="http://code.jquery.com/jquery.js"&gt;&lt;/script&gt;
      &lt;script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"&gt;&lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Displays like shown below</p>
  
  <p><img src="https://i.stack.imgur.com/p3ckr.png" alt="enter image description here"></p>
  
  <p>Here's the same code with only the version number updated</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;Bootstrap 101 Template&lt;/title&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;!-- Bootstrap --&gt;
        &lt;link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;h1&gt;Hello, world!&lt;/h1&gt;
        &lt;button class="btn"&gt;hello&lt;/button&gt;
      &lt;script src="http://code.jquery.com/jquery.js"&gt;&lt;/script&gt;
      &lt;script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"&gt;&lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Which displays with a flat style as shown below. Looking at it here I am realizing that there are some other style issues too. Like the margins look wrong and the font looks off.</p>
  
  <p><img src="https://i.stack.imgur.com/XMZqt.png" alt="enter image description here"></p>