ace 编辑器比它的父 div 类大

Question

我正在尝试在我的网页中使用 ace 编辑器。

王牌编辑器github：https://github.com/ajaxorg/ace

在html正文上，我像这样在div“第三页”中插入了ace editor div类

<div id="third-page" style="display: none;">
    <div id="editor"> test </div>
    <button class="btn btn-primary btn-lg" id="priv_3">Previous</button>
    <button class="btn btn-primary btn-lg" id="next_3">Next</button>
</div>

我按照 github 教程中的说明声明了样式表。

但它太小了，我想匹配它的父级大小。

我找到了相关的stackoverflow页面

How to get the ace editor to adjust to its parent div

并像这样尝试过

#editor {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

结果是这样的

div id "editor" 比它的父 "third-page" 大，我尝试了几件事，但它不起作用。

我该如何突破这个问题？

Answer 1

将third-page 的位置设置为相对，以使其中的绝对定位子元素相对于该元素而不是 document.body