我有一个textarea元素,它位于页面的页脚(模拟iOS中消息原生撰写框)。随着文本的输入,它会相应地增长或缩小。该元素的高度似乎被计算为52像素。
我希望高度更小。然而,设置初始高度(没有important)只会被52px覆盖。将初始高度设置为约35px(使用important)会禁用自动增长功能,并出现滚动条。我已经尝试了Web检查器,但似乎无法找出这52px是从何处计算出来的。
解决这个问题的方法是什么?代码非常简单。我使用jQuery 1.10.2和jQuery Mobile 1.4.0。
HTML
<div data-role="footer" data-theme="a" data-position="fixed" data-tap-toggle="false" class="custom-footer">
<div class="group-footer">
<div class="map-icon">
<img src="assets/compose-action-arrow@2x.png" style="width: 25px;height: 25px;" />
</div>
<div class="text-box">
<textarea name="textarea" class="define-textarea" id="inbox-continue-conversation"></textarea>
</div>
<div class="send-link"><a href="#" id="inbox-continue-answer-button">Send</a>
</div>
</div>
</div>
CSS
.define-textarea {
font-size: 1em !important;
border-color: #cccccc !important;
border-radius: 5px;
}
textarea
元素上做了一些疯狂的事情,需要进一步检查。文档:http://api.jquerymobile.com/textinput/ - marionebl