title: <input> with display:block inside a text-align:center div
body: <p>With this:</p>
  
  <pre><code>&lt;div id="parentdiv" style="text-align:center;width:600px;margin:auto;"&gt;
    &lt;input type="button" value="push me" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The button is aligned to the center of the browser window (as desired) in FF, Chrome, IE7 and IE8.</p>
  
  <p>But, add "display:block" to the button:</p>
  
  <pre><code>&lt;div id="parentdiv" style="text-align:center;width:600px;margin:auto;"&gt;
    &lt;input type="button" style="display:block;" value="push me" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The button is aligned to the center in IE7 - and is <strong>not aligned to the center</strong> in FF, Chrome and IE8.</p>
  
  <p>Why? And can a button (or any &lt;input&gt;) with display:block be center-aligned in some way? (other than using &lt;center&gt; - which works on all browsers mentioned, btw - but is "forbidden"...)</p>