Ширина текстовой области не совпадает с содержащим div

Мне интересно, почему текстовое поле отказывается оставаться выровненным с содержащим его div?

<!-- the textarea pokes out-->
<div style="border:1px solid #ccc; width:300px">
  <textarea style="width:100%"></textarea>
</div>

Это вызывает у меня сложность обеспечения выравнивания элементов