html - 「コード」タグの上/下の余分な空白を取り除く

Question

<code>HTMLのこれらのタグの上と下の空白がどこから来ているのかわかりません。マージンやパディングではないようです。以下の例では両方とも 0 に設定されており、chrome dev ツールを使用した検査では何の答えも得られないようです。余分なスペース (上下の緑色のボックス) は、Chrome、FF、および IE9 で表示されます。

http://jsfiddle.net/RPaLd/

<style type="text/css">
    section{
      border: thin solid black;
    }

    pre{
      border: thin solid red;
    }

    code{
      border: thin solid green;
      margin: 0px 0px;
      padding: 0px 0px;
    }
</style>

<section>
    <pre>
        <code>
            // some code goes here
        </code>
    </pre>
</section>

Answer 1

編集:他の誰かがまったく同じものを既に投稿していることに気付きませんでした - 申し訳ありません!

---

タグではpreすべての空白が保持されます -<code>タグの前後の空白を削除します:

<section>
    <pre><code>// some awesome code</code></pre>
</section>