Textarea having always window height

I'm not sure how to do this. II'm currently using Bootstrap's textarea, along with its container. I don't know how to make it so that the textarea extends to the bottom of the screen, which automatically increase/decrease depending on the window height. I've tried:

#form-control {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
}

But nothing seems to change. Does anyone know how I can get this done?

Edit:

This is my html file:

<body>
    <div class="container">
        <div class="form-group">
            <textarea class="form-control" rows="15" id="note"></textarea>
        </div>
    </div>
</body>

Answers 1

  • Try this code. Actually you have used (id) #form-control, which should be (class) .form-control I've used your code, just added width 100% Now it'll take height and width of screen.

    .form-control {
        position:fixed;
        top:0;
        left:0;
        right:0;
        bottom:0;
        width:100%
    }
    <div class="form-group">
      <textarea class="form-control" placeholder="textarea"></textarea>
    </div>


Related Articles