html - 响应式文本区域

Question

大家好，我正在尝试让我的 textarea 响应。但我真的不知道该怎么做。我尝试使用 width 100% 和 max-width 600px。我的容器也有 600 像素的宽度。当 width 100% 时，textarea 变得比同样有 600px 的 Container 小。 max-width 600px 框变得非常小。 这是我的代码:

<div class="container contact">
<textarea class="inputmessage"></textarea>
</div>
.inputmessage{
    float: left;
    border: 2px solid black;
    height: 150px;
    width: 600px;
}
.container{
    text-align: center;
    margin: auto;
}

.contact{
    width: 600px !Important;
}

Answer 1

将容器的最大宽度设置为 600 像素；删除 float 。 检查这个 fiddle 。

.inputmessage{
    border: 2px solid black;
    height: 150px;
    width: 100%;
}
.container{
    text-align: center;
    margin: auto;
}

.contact{
    width: 100%!Important;
    max-width:600px;
}

https://jsfiddle.net/Lx89qtte/