如何在textarea的右上角放置一个跨度？

Question

我有一个文本区域id="aboutme"和一个跨度class="maxlength-feedback",我希望跨度位于textarea的右上角.它将成为文本区域的计数器.

我知道这两个元素应该有position="relative",而跨度应该是display="inline-block",但它不起作用.

我将不胜感激任何帮助.谢谢.

Answer 1

就这样做吧

说明:您的包裹textarea的容器内div,并给position: relative;到容器中,position: absolute;以span,现在,以确保您的div默认行为是display: block;将左所以用极端的跨度流display: inline-block;为您的div容器

演示

HTML

<div class="wrap">
    <textarea></textarea>
    <span>Counter</span>
</div>

CSS

.wrap {
    position: relative;
    display: inline-block;
}

.wrap span {
    position: absolute;
    top: 0;
    right: 0;
}