textarea resize родительский контейнер div

Question

Как я могу заставить div расти в высоту, когда текстовая область изменяется в html?

У меня есть следующий код

<div class="reply"> 
      <p>Please enter your reply:</p> 
      <textarea rows="4" cols="80"></textarea> 
      <br /> 
      <input type="submit" value="Submit reply"/> 
      <div class="clear"></div> 
    </div> 

Однако, когда пользователь изменяет размер, текст-зона выходит из контейнера, как я могу сделать высоту родительского DIV растет с размером области текста ?

Изображение проблемы

Answer 1

Ваш .reply div будет изменен автоматически, если вы не дают фиксированную высоту. , если вы хотите изменить размер только по вертикали, чем попытаться использовать -

textarea { 
    resize: vertical; 
    overflow: auto; 
} 

jsfiddle

Ссылка: https://developer.mozilla.org/en-US/docs/Web/CSS/resize