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

发布时间：2020-12-14 23:49:12 所属栏目：资源来源：网络整理

导读：我有一个id =“aboutme”的文本区域和class =“maxlength-feedback”的跨度,我希望跨度位于textarea的右上角.它将成为文本区域的计数器. 我知道这两个元素应该有position =“relative”,而span应该是display =“inline-block”,但它不起作用. 我将不胜感激任

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

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

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

解决方法

就这样做吧

说明：将textarea包装在容器div中并给出position：relative;到容器,位置：绝对;要跨越,现在要确保你的div默认行为是display：block;将使你的跨度流向最左边,所以使用display：inline-block;为你的容器div

Demo

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;
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!