Jak ustawić pozycję w prawym górnym rogu obszaru tekstowego?

Question

Mam obszar tekstowy z id="aboutme" i span z class="maxlength-feedback", chcę, aby zakres był umieszczony w prawym górnym rogu obszaru tekstowego. Będzie to licznik dla obszaru tekstowego.

Wiem, że oba elementy powinny mieć position="relative", a zakres powinien być display="inline-block", ale nie działa.

Byłbym wdzięczny za każdą pomoc. Dzięki.

Answer 1

Po prostu zrób to jak ten

Objaśnienie: Owiń textarea wewnątrz kontenera div i dać position: relative; do pojemnika, a position: absolute; do span teraz mieć pewność, że domyślne zachowanie div, który jest display: block; sprawi, że przepływ rozpiętości na skrajnej lewicy więc używać display: inline-block; do kontenera 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

nie, MaxLength sprzężenia zwrotnego musi być absolute ustawione, tak;

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

Przykład pracy: http://jsfiddle.net/VSWXs/