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

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

Answer 2

不，maxlength-feedback必须absolute定位，就像这样;

#aboutme {
 position:relative;
}

.maxlength-feedback {
position:absolute;
right: 0; /* or so */
top: 0; /* or so */
}

Answer 3

<强> HTML

<div>
    <span class="mySpan">Some Text</span>
    <textarea class="myTextArea"></textarea>
</div>

<强> CSS

div{
    position: relative;
    float:left;
}

.mySpan{
    position: absolute;
    right: 0px;
}

工作示例：http://jsfiddle.net/VSWXs/

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

3 个答案: