html - cssテーブルセル、コンテンツに不要な上部マージンがあります

Question

コードでdivブロックのテーブルセル配置を使用しています。コードに問題があります。

私のHTMLがどのように見えるかのプレビューはここにあります

最初のパネルにコンテンツ（テキストまたは画像）がある場合.inner、2番目と3番目のパネルのdivの上部マージンは約10〜15ピクセルです。何故ですか ？

誰かが私が欠けているものを見て、私に知らせてもらえますか？

Answer 1

追加vertical-align:top;する#wrapper > div

デモを参照してください：http：//jsbin.com/avozik/14/edit

Answer 2

私も同様のケースがありvertical-align:top;、問題を解決します。ただし、この背後にある理由を詳しく説明したいと思います。

https://jsfiddle.net/46tyc48y/1/

テーブルセルはvertical-align:baseline;デフォルトで使用するため、右側のセルテキストは画像のベースライン（下部）に揃えられ、上部にファントム間隔が作成されます。したがって、vertical-alignこの動作をバイパスするように明示的に設定する必要があります。