Направление ltr на странице HTML rtl

Я пытаюсь отобразить отрицательное число на странице HTML rtl.

Ярлык, кажется, не отвечает на мой direction: ltr

Я написал jsFiddle, чтобы отобразить противоположный сценарий (попытка отображения справа налево).

Ответ 1

Добавьте unicode-bidi: embed; в свой CSS. Должен сделать трюк - обновленный скрипт

Здесь вы можете найти

Ответ 2

Причина, по которой direction: ltr не помещает знак минус слева от числа, заключается в том, что окружающие символы являются символами справа налево, делая "нейтральные" символы, такие как цифры, и минус (или дефис) принимают эту направленность, Свойство direction влияет на расположение макетов ящиков и связанных с ними проблем, а не на направление текста.

Рассмотрим следующее:

<p>א <label id="ProfitShk" class="labelVal">-9 ₪</label> ת
<p>a <label id="ProfitShk" class="labelVal">-9 ₪</label> b

В первом случае дефис появляется справа от цифры 9, следуя направлению записи окружающего текста. Во втором случае порядок противоположный, потому что окружающие символы являются латинскими буквами, которые имеют неотъемлемую направленность слева направо.

Это сложная проблема, и некоторые страницы на иврите, похоже, используют трюк для размещения дефиса после номера в HTML-источнике, поэтому, когда применяется право справа налево, дефис появляется слева от номера.

Более подходящие подходы:

  • Используйте unicode-bidi: bidi-override в CSS вместе с direction. Это означает, что внутренняя направленность игнорируется внутри содержимого и применяется порядок, указанный direction.
  • Используйте unicode-bidi: embed в CSS вместе с direction. Это создает "остров направленности", внутри которого окружающий текст не влияет на направленность. Когда содержимое элемента содержит только "нейтральные" символы, тогда свойство direction задает направление текста.
  • Используйте <bdo> элемент в HTML с атрибутом dir. Это HTML-аналог метода 2, и лучше в том смысле, что речь идет не о стилистических презентационных предложениях (это то, для чего нужен CSS и делает лучше всего), а в том, чтобы все понять, имея дело с некоторыми основными проблемами направленности.
  • Используйте знак слева направо и справа налево до и после строки. Они могут быть представлены в HTML как &lrm; и &rlm; соответственно. Это делает последний символ перед строкой влево-вправо, заставляя ее отображаться слева направо, если она содержит только "нейтральные" символы.

Это была упрощенная презентация сложной проблемы. Во всяком случае, использование <bdo>, вероятно, лучший подход. Во всех подходах настройка направленности должна быть ограничена наименьшей возможной строкой, например -9 в примере:

<p>א <label id="ProfitShk" class="labelVal"><bdo dir="ltr">-9</bdo> ₪</label> ת

Символ, используемый как знак минуса, должен действительно быть минусом Unicode "-" U + 2212 MINUS SIGN, представляемым в HTML как &minus;, но это не влияет на проблему направленности.

Ответ 3

В дополнение к ответу Хенрика, я бы добавил символ управления LRM до знака минус:

<label id="ProfitShk" class="labelVal">&lrm;-9 ₪</label>​​​​​​​​​​​​​​​​​​​​​​

Таким образом, знак минуса помещается перед 9 (что, вероятно, вам нужно)

Этот microsoft doc объясняет символ управления LRM вместе с другими управляющими символами.