htmlcsstwitter-bootstrap

How to increase height of textarea using bootstrap rows and columns


I have designed a form in which I have two items in a row, like this:

My output

enter image description here

Code that I used:

<div class="row">
    <div class="col-sm-3">  <!-- [1, 0] -->
        <fieldset class="form-group">
            <label id="fieldTitle">Equipment Length</label>
            <select id="selectOption" class="form-control" required data-error="Please select Equipment Length"></select>
            <div class="help-block with-errors"></div>
        </fieldset>
    </div>
    <div class="col-sm-9">  <!-- [1, 1] -->
        <fieldset class="form-group">
            <label id="fieldTitle">Customer Notes</label>
            <textarea class="form-control" placeholder="Please write customer notes" ng-model="myTextarea" required data-error="Please enter customer notes"></textarea>
            <div class="help-block with-errors"> {{myTextarea}} </div>
        </fieldset>
    </div>
</div>

So, please guide me how do I increase the height of the textarea just like my

desired output enter image description here please tell me how do I do it. Thanks


Solution

  • textarea {
      width: 300px;
      height: 150px;
    }
    

    adjust as needed.