我正在尝试解决<textarea />位于绝对位置且具有某个顶值的情况，如果它位于溢出隐藏父级内部，则不会跟随它的位置。
这个极小的代码示例完美地解释了它：
https://jsbin.com/xitayayiza/edit?html,css,output
以下是此代码示例的工作原理： https://monosnap.com/file/TkEHFXaAXslh3XkakCjkzfvVqLLB0q
在<textarea />成长时，您可以看到的视频，覆盖上方的空间（althogh它有position: absolute; top: 10px;
问题是：是否有一种通过CSS设置textarea的方式，它始终保持其最高值？
正如您在视频中看到的那样，顶部空间（在textarea上方）等于值top: 10px;但是在编辑textarea并向其中添加更多内容时空间减少了，而我希望永久保留它相同。
答案 0 :(得分：0)
如果您希望任何体面的浏览器允许将<textarea>的插入符号放入“视图外”或“无法访问“区域，你错了。简单地说，它永远不会发生。只有一个例外：当<textarea>有滚动条并且用户滚动它时，插入符号就会消失。但是，对插入符号位置的任何更改都会立即将其滚动回视图。
为什么呢？因为它被认为是关键状态，因为它不仅使页面，而且浏览器似乎（并且实际上）不可用。这可能对您不重要，但对浏览器制造商来说非常重要。
由于一些不幸的设计决策，插入符号最终出现在不可渲染的区域中，如您的示例所示，浏览器会介入并使其可见。它必须忽略/覆盖您的一些规则，以便插入符号再次可见。而不是完全删除overflow:hidden（实际上是由某些浏览器完成） - 大多数浏览器更喜欢用overflow:hidden“滚动”元素的内容到视图中（这不是一个合适的滚动，通常没有涉及滚动条 - 它更像是一个“shift”）;因此，他们将内容转移到允许用户继续看到他们输入的直接结果的位置。一旦<textarea>失去焦点或插入符号移动到（通常）可见区域，这种变化是暂时的并且还原。
底线，无论何时将<textarea>置于带有overflow:hidden的较小元素内，预计它会被移动，因此插入符始终可见。
在实践中，您会注意到<textarea>通过将其置于position:absolute父级而不是将此属性应用于自身而变得更具可预测性和可控性。但是，再次，不要指望浏览器允许您隐藏插入符号。
你是一个微不足道的设计师/编码员，远不如他们的任何活跃用户重要 显然，失去活跃用户对大多数浏览器制造商来说都是一件大事。