Mozilla 3.0.8 и высота Chrome в способе устранения ошибок

Question

У меня есть текстовая область внутри div :

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

... и 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 делает это прекрасно: высота текстовой области 1014 * равна высоте переноса div . В Mozilla и Chrome оберточный div отображается высотой 7em, но текстовая область составляет около 20-25 пикселей недостаточно высокой, так что между нижней частью текстовой области и нижней границей div есть зазор. Кто-нибудь знает, как это исправить?

Answer 1

В текстовой области по умолчанию используется другой шрифт, поэтому размер отличается (так как ems относятся к размеру текста).

Добавить это:

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

Проверено и работает в FF3