title: different represent of HTML in firefox and chrome
body: <p>I am confused with: this code daemon display different in Firefox and Chrome:</p>
  
  <pre><code>&lt;div style="border:1px solid black;"&gt; 
      &lt;a href="baidu.com" &gt;AA&lt;span style="float:right"&gt;BB&lt;/span&gt;&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <pre class="lang-css prettyprint-override"><code>a {
      display: block;
      padding: 3px 20px;
      clear: both;
      font-weight: normal;
      line-height: 1.42857;
      color: rgb(51, 51, 51);
      white-space: nowrap;
      border:1px solid red;
  }
  </code></pre>
  
  <p>CodePen: <a href="http://codepen.io/ChinaXing/pen/jwFon" rel="nofollow noreferrer">http://codepen.io/ChinaXing/pen/jwFon</a></p>
  
  <p>In Chrome:</p>
  
  <blockquote>
    <p><img src="https://i.stack.imgur.com/uhUfH.jpg" alt="In Chrome"> </p>
  </blockquote>
  
  <p>In Firefox:</p>
  
  <blockquote>
    <p><img src="https://i.stack.imgur.com/wJ0qp.jpg" alt="In Firefox"></p>
  </blockquote>