クロスブラウザのマージンに矛盾がありますか？

Question

私は、テキストエリアと余白のxブラウザの互換性（ChromeとFF）に小さな問題があります。問題の

ページはこちらです：http://www.mylesgray.com/contact/

あなたが見ることができるように "メッセージ" の下textareaがChromeでよりFFが異なる：

FF 11：

Chrome 17：

両方のChromeラインの下端と右端を完全に見ているかどうかはわかりますが、FFは両方向でさらに見えるため、FirebugまたはChrome Dev Toolsのいずれの理由でもうまく動作しません。

エスプレッソはChromeと同じように表示されるため、ウェブキットとゲッコの問題のようです。

上記のCSSは次のとおりです。

.wpcf7-message { 
    float: left; 
    width: 26em; 
    height: 12.3em; 
    margin: 0; 
} 

.wpcf7-message textarea { 
    resize: none; 
    padding: 1em; 
    width: 100%; 
    height: 100%; 
    margin-top: 1.1em; 
    border: none; 
    -moz-border-radius: 0.5em; 
    -webkit-border-radius: 0.5em; 
    border-radius: 0.5em; 
} 

すべてのヘルプははるかに高く評価します！

マイルズ

Answer 1

幅、マージン、およびパディングのためにどこでも使用しているユニットは、おそらくemです。 emユニットはフォントサイズに基づいており、webkitはgeckoとは少し異なるフォントをレンダリングします（webkitとgeckoの同じテキストは異なる幅になります）。

テストでは、CSSの幅、余白および余白を絶対値pxに変更し、不一致が修正されているかどうかを確認してください。

Answer 2

私は、これは、それはIEの固定ファイルが付属している

<!--[if lt IE 8]> 
<link rel="stylesheet" href="../../blueprint/ie.css" type="text/css" media="screen, projection"> 
<![endif]--> 
<!--[if lt IE 9]> 
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
<![endif]--> 

をあなたにクロスブラウザの問題のこれらの種類を助け、多くの時間

が保存されます、

使用blueprint css frameworkを言うだろう