Mozilla 3.0.8 und Chrome Höhe in em Fehler Abhilfe

Question

ich eine TextArea- in einem div haben:

<div id="textareawrapper"> 
    <textarea id="chat"></textarea> 
</div> 

... und CSS:

#textareawrapper { 
    border 1px dashed pink; 
    margin:0;padding:0; 
    position: absolute;bottom: 0em;left:7.5em;right:7.5em;height: 7em; 
} 
#textareawrapper textarea {margin:0;padding:0;width: 100%;height:7em;} 

IE 7 macht es gut: die Höhe des Textfelds ist gleich der Höhe der Verpackung div. In Mozilla und Chrome ist das Wrapping Div 7m hoch gerendert, aber das Textfeld ist etwa 20-25px nicht hoch genug, so dass es eine Lücke zwischen dem unteren Rand des Textfelds und dem unteren Rand des div gibt. Kann jemand das beheben?

Answer 1

Der Textbereich verwendet standardmäßig eine andere Schriftart, daher ist die Größe unterschiedlich (da ems sich auf die Textgröße beziehen).

Fügen Sie diese:

#textareawrapper textarea { font-size: 100%; font-family: inherit; } 

Getestet & arbeiten in FF3