2

我有一个需要能够使用Rows属性调整大小的文本区域。我还希望能够调整文本区域内文本的行高。但是，这会导致IE9 和 IE10 中出现滚动条。有没有不涉及javascript的方法？

这个 JSFiddle 说明了这个问题：http: //jsfiddle.net/JYkAX/6/

这是html：

<textarea rows="3" class="textbox">No line-height
2
3</textarea>
<div class="separator"></div>
<textarea rows="3" class="textbox2">Lineheight = 20px
2
3</textarea>

这是CSS：

.textbox
{
    overflow: auto;  
}
.textbox2
{
    overflow: auto;
    line-height: 20px;
}
.separator
{
     display: block;
     height: 10px;
}
4

3 回答 3

0

为ie创建一个额外的css文件并将line-height设置为例如13px；

于 2013-03-11T20:59:20.473 回答
0

你的 css 很好，但要使这项工作添加 Jquery：

$(document).ready(function() {

  var textArea = $('textarea'),
      lineHeight = parseFloat(textArea.css('lineHeight'));

  textArea.height(lineHeight * textArea.attr('rows'))

});

这将定义行高及其自动高度。

我知道你没有提到 JS，但是当我不得不处理类似的事情时，jquery 是我唯一的解决方案

泽克

于 2013-03-11T21:04:43.970 回答
0 
use this line-height: 15px\9; in css

它是现代浏览器的 css IE9 hack。它会起作用的。我在 IE9 上查看。你在IE10上检查它。因为我没有IE10。

这是一个很好的问题。我喜欢它的正确回答:)

于 2013-03-11T22:09:34.650 回答