Почему не работает text-align:justify;?

Question

[ognivushka]

Здравствуйте, пишу код, конкретно такой:

<p class="text">To create a chart, we need to instantiate the <span class="other"> chart </span> class. To do this, we need to pass in the 2d context of where we want to draw the chart. Here's an example</p>
<p class="cod">
  <span class="blue">&lt;canvas </span> <span class="green"> id=</span><span class="red"> "myChart" </span> <span class="green"> width=</span> <span class="red"> "400" </span> <span class="green">height=</span><span class="red"> "400" </span><span class="blue">&gt;&lt;&frasl;canvas &gt;</span>
  </p>

Пробую применить к .cod значение text-align:justify, что бы растянуть надпись на всю ширину контейнера, но это не срабатывает. При этом значение right, left и т.д. работает.
Пробовала установить определенную ширину, но тоже не выходит.
В чем может быть проблема?

Answer 1

[Алексей Уколов]

Ну почему же не работает? Всё прекрасно работает, если указать контейнеру ширину так, чтобы текст переносился: https://codepen.io/alexey-m-ukolov/pen/PoQQQEa
Если строка всего одна, то justify ведёт себя как left.
Но на это можно повлиять, указав дополнительно text-align-last: justify; (в Сафари работать не будет)

Comments

[ognivushka]

наверно данных маловато дала https://codepen.io/ognivushka/pen/OJQQNGd вот такой код, вроде проверяю в структуре - применяется, но по факту я не вижу этого)

[ognivushka]

Попробовала text-align-last и сработало! спасибо!