Можно ли выровнять текст по горизонтали на символе?

Question

Скажем, у меня есть такой фрагмент текста:

x = 2 / y
a + b + c = x

Возможно ли с помощью CSS (или, возможно, с помощью других приемов) выровнять эти строки так, чтобы они выглядели так?

        x = 2 / y
a + b + c = x

Полагаю, я мог бы прикрепить левую часть в одном столбце таблицы, знак = на следующей и правую сторону в третьей, а затем использовать выравнивание по правому краю, центру и по левому краю, но это не кажется особенно чистым илисемантически правильно: p

Answer 1

Используйте свойство CSS text-align для выравнивания текста.
Если вы хотите выровнять по количеству пробелов в вашем тексте, используйте white-space для сохранения пробелов вместе с моноширинным шрифтом, Fiddle: http://jsfiddle.net/cCLZy/

<style>
.right-align {
    /*text-align: right;*/
     white-space: pre; 
     font-family: monospace;
}
</style>

<!-- Spaces and newlines are preserved -->
<div class="right-align">
        x = 2
a + b + c = x
</div>

Answer 2

Ну, это немного сложно, но надеюсь, что это поможет: http://jsfiddle.net/7RgcY/1/

Хитрость, как вы можете видеть, заключается в свойстве display: table-cell.Я установил ширину 6em в тегах span, которая может работать для коротких предложений, но вы должны установить «фиксированную» ширину, чтобы она работала.

К сожалению, код не слишком чистый ...

Answer 3

Я не проверял этот подход, может потребоваться некоторая настройка, но он должен работать. Если вы хотите выровнять знаки равенства, вы можете сделать это:

<style>
.left {
width: x; /*You have to give them width to make the effect of two columns*/
text-align: right;
float: left;
}
.right {
width: x; /*You have to give them width to make the effect of two columns*/
text-align: left;
float: left;
}
.clr { clear: both; } /*Clear to keep next elements from floating too*/
</style>
<div class="left">
 <p>x = <br />
 a + b + c =</p>
</div>
<div class="right">
 <p>2 / y<br />
 x</p>
</div>
<div class="clr"></div>

Answer 4

text-align:right ??

http://jsfiddle.net/Q42U4/

Answer 5

Вы всегда помещаете текст в таблицу.Позволит вам все выровнять.