textarea的动态尺寸

我正在使用CodeMirror 2编辑器。麻烦的是我无法做到全尺寸（100％; 100％）。我添加到主要风格：textarea的动态尺寸

.CodeMirror { 
    height: 100%; 
    width: 100%; 
}

而这在任何浏览器中都不起作用。无论如何？

来源

2011-03-20 Ockonal

我使用以下代码中http://jsbin.com伸展CodeMirror帧（特别注意到伸展该JS滨到一半屏幕宽度，但下面的例子代码执行“全屏”）：

.CodeMirror { 
    position: absolute; 
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
}

我不记得是否CodeMirror默认添加了类，但如果没有，你还需要将其添加在JavaScript（假设你没有解决了这个已经）：

CodeMirror.fromTextArea('ID_OF_TEXTAREA', { 
    // .. some other options... 
    iframeClass: 'CodeMirror' 
});

来源

2011-03-20 12:21:17

请看，这里是我的完整代码：http://pastie.org/1692307 – Ockonal 2011-03-20 12:27:29

它仍然不适合我。 – Ockonal 2011-03-20 12:36:27

哦，我解决了这个问题。谢谢。 – Ockonal 2011-03-20 14:53:16

你不能做到这一点与CSS，而不是你可以使用JavaScript：

window.onload = function() { 
    var oTextarea = document.getElementById("myText"); 
    var oParent = oTextarea.parentNode; 
    oTextarea.style.width = (oParent.scrollWidth - 30) + "px"; 
    oTextarea.style.height = (oParent.scrollHeight - 30) + "px"; 
};

这将设置textarea基于其母公司的大小尺寸。
增加了一些“填充”，但您可以删除或减少它。

来源

2011-03-20 10:03:16

这对我没有帮助:( – Ockonal 2011-03-20 11:09:31

@Ock - textarea是如何定义的？它是否有ID？父元素？它对我在快速测试中的工作有帮助 – 2011-03-20 11:10:58

使用CodeMirror？因为它包装了textarea – Ockonal 2011-03-20 12:12:16

html, body, .container, .subContainer, .CodeMirror { 
    height: 100%; 
    width: 100%; 
}

应该可以工作。

来源

2013-02-05 14:33:23

textarea的动态尺寸

回答

相关问题