I need to change the width and the height of the <textarea>
tag of HTML and I need it to have just
two lines (rows). Currently, it has just one line. Any idea how to fix this?
For the width, even if I change it to 1000px
nothing changed and I don't understand why.
<div>
<textarea rows="2" cols="200" disabled="disabled" style="width:500px; height: 10px;">
Date
User
</textarea>
</div>
I'm using Bootstrap in an MVC5 application.
Remove the height declaration on the textarea
, just specify the rows using rows="2"
<textarea rows="2" cols="200" disabled="disabled" style="width:500px;">
Date
User
</textarea>
height
will conflict with rows
and width
will conflict with cols
.
Keep reading if you want to set height of your text areas depending on size of the content
<textarea id ="code" rows="2" cols="200" disabled="disabled" style="width:100%; height:auto" >
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
</textarea>
And then in Document ready assign height of text area = scroll size
$(document).ready(function(){
textAreaAdjust(document.getElementById('code') );
});
function textAreaAdjust(o) {
o.style.height = "1px";
o.style.height = (o.scrollHeight)+"px";
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With