html - Decrease number of columns in textarea in mobile view -


i want decrease number of columns in textarea in mobile view,how can this?
here html(based bootstrap):

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>   <div class="row">       <div class="col-xs-6 col-sm-6 col-md-2">            <textarea name="content" rows="4" cols="80" id="content"></textarea>       </div>   </div>

in mobile view need scroll screen sideways show texterea,so want decrease number of columns.

you can use class form-control on textarea , control width setting width on parent. form-control tries cover full width of parent. when set parent's class col-xs-10 textarea constrained accordingly.

if screen width reduces, textarea resize automatically.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>   <div class="row">       <div class="col-xs-10">            <textarea class="form-control" name="content" rows="4" id="content"></textarea>       </div>   </div>


Comments

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

php - How can i create a user dashboard -

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -