Textarea重点关注并离开

时间:2017-09-07 16:39:22

标签: html css twitter-bootstrap textarea

我遇到了一个我以前从未见过的问题:一个普通的常规html textarea,可以调整焦点。

即使我设置了所需区域的高度,它仍会调整为更小或更大的值,但没有明显的相关性。我试图在没有运气的情况下删除项目上的所有课程。

这是引导物吗?
我该如何解决?
链接到问题的短视频:
https://www.dropbox.com/s/7329y5a96ixajl4/18-34-46.wmv?dl=0

<textarea style="min-height: 150px; height: 150px; 
   max-width: 100%;" type="text" name="jobDesc" 
   ng-model="req.jobDesc" placeholder="Write a description for the assignment">
</textarea>

1 个答案:

答案 0 :(得分:1)

  

尝试使用rows Attribute

<textarea rows="4" >
This should force the text area to only show 4 lines, or 5, as you desire. 
</textarea>
  

无论如何,我认为您可以检查文本区域的大小或   计算出的属性,点击浏览器上的“检查”(for)   示例铬)。然后单击样式/计算,您将看到   你正在申请的款式。

属性的图像:

enter image description here

修改

  

我曾试图想一想哪个属性打破了它,   试试吧。它似乎需要寻找textarea:focus或类似的   在你的css内:)

     

更改了代码段以显示填充属性如何影响大小

#editor1 {height: 10px;}
#editor1:focus {height: 20px;}

#editor2:focus { padding-bottom: 10px;}
<textarea id="editor1" placeholder="Check it!!"></textarea>
<textarea id="editor2" placeholder="Check it!!"></textarea>

解决后改进了OP的评论:

I did actually manage to find out what caused the problem. Hidden in one of the js files was some legacy code to manage resizing of textareas. As some of the pages where loading in templates on top of the actual page(in a aside/modal) the code wasnt running correctly. Thank you for taking the time. It led me to my