html - 防止调整容器大小删除内部文本

Question

<div class="title">
        <h1>
            <span class="small-title">Test test</span>
            <div class="title-line"></div>
            <span class="animated-title"></span><span id="typing-cursor"></span>
        </h1>
    </div>

通过删除容器中包含的所有文本（在本例中包含在“动画标题”中），容器会消失（好像它的尺寸变为 0.0），直到再次插入内容。不幸的是，这会导致 h1 容器中包含的所有元素发生移动。我试图设置一个“最小高度”，但结果没有改变。我也给你留下了 codepen 的链接，但奇怪的是，在那个网站上，当文本被删除时，容器没有调整大小。Codepen 示例 谁能告诉我如何解决它？