text-align right in small width div

Question

Я пытаюсь выровнять текст справа в небольшой области. Он становится левым, когда контейнер мал. Есть ли способ заставить его правильно выровнять?

div 
{ float: right; 
width: 100px; 
height: 50px; 
text-align: right; 
border: thin solid black; 
} 

https://jsfiddle.net/a362zr54/

Answer 1

Если добавить direction: rtl; он будет делать, что

div { 
 
    float: right; 
 
    width: 100px; 
 
    height: 50px; 
 
    text-align: right; 
 
    border: thin solid black; 
 
    direction: rtl; 
 
}

<div> 
 
1testtesttesttesttesttesttesttesttest2 
 
</div>

Answer 2

Просто добавьте direction: rtl; в контейнер.

Demohttps://jsfiddle.net/a362zr54/1/

Answer 3

Вы можете попробовать direction: rtl;, но это может испортить ваш текст.

Если ваш контент имеет фиксированный размер, как в вашем примере. Вы можете также использовать position:absolute;right:0; так:

.container { float: right; 
 
width: 100px; 
 
height: 50px; 
 
border: thin solid black; 
 
position:relative; 
 
} 
 
.content { 
 
    text-align: right; 
 
    position:absolute; 
 
    right:0; 
 

 
}

<div class="container"><div class="content"> 
 
testtesttesttesttesttesttesttesttest 
 
</div> 
 
</div>