Sandro21 Sandro21 - 1 month ago 5
CSS Question

Responisve Textarea

Hello guys i am trying to make my textarea responsive. But i have really no idea how to do that. I tryied it with

width 100%
and
max-width 600px
. My Container also has a width of 600px. With
width 100%
the textarea gets smaller then the the Container that also has 600px. With
max-width 600px
the box gets extremly small.
This is my Code:

<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

Make max width on container to 600 px; remove the float. Check this 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/