Textarea Width

Hello. I have a contact form with a
textarea input and when I give it a width
of more then 300px it does not become responsive (
ignoring the map it is not responsive yet) are textareas
treated differently? PAGE

<label><textarea class="txt-area" name="UserComments" placeholder="Your Comments..."></textarea></label><br>

CSS:

.txt-area {
    font-family: "open sans";
    font-size: 9pt;
    border: 3px inset #1d4189;
    padding: .5em;
    width: 300px;
}

It can’t be responsive if it has a fixed width! Fixed widths are the antithesis of responsiveness. So it’s not responsive even now.

A better approach is to remove the inline-block from the parent, set the textarea to width: 100%, and also just set a max-width on it if you don’t want it to be too big.

1 Like

You need to size the textarea to the fluid container in sits in by setting the textarea to width:100% and then it will take all the available space.

Use the border-box model if you have padding and borders on the textarea.

1 Like

Got it thanks

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.