Почему вертикальная ориентация текста не работает в Safari или Edge? - PullRequest
Новая
       0

Почему вертикальная ориентация текста не работает в Safari или Edge?

0 голосов
/ 09 апреля 2020

Из того, что я могу сказать, text-orientation:upright не действует ни в Safari, ни в Edge, хотя отлично работает в Chrome и Firefox. Я нигде не могу найти упоминания об этой проблеме. Единственное предостережение, перечисленное в https://caniuse.com/#feat = css -text-ориентации , заключается в том, что Safari требует префикс -webkit-, но я его предоставил, и он все еще не работает. Вот скрипка: https://jsfiddle.net/tn3bdf52/

Мой единственный доступ к Safari только на iPad, но в инструментах разработчика Edge свойство имеет красное подчеркивание, как будто оно недопустимо. Свойство writing-mode:vertical-lr имеет черную линию, как будто оно переопределяется, но IDK чем. Это все еще работает. Я попытался изменить значение на tb-lr, но это не имело значения.

1 Ответ

0 голосов
/ 09 апреля 2020

Вы допустили небольшую ошибку с префиксом -webkit- . -webkit-text-ориентация - правильное правило, проверенное на Ma c с Safari. Пожалуйста, попробуйте.

PS В Microsoft Edge v.80.0.361 текстовая ориентация тоже работает 

ul {
  margin: 0;
  padding: 0;
  list-style: none;
  writing-mode: vertical-lr;
  -webkit-text-orientation: upright;
  text-orientation: upright;
}

li {
  padding: 1em .5em;
}
<html>
<body>
  <ul class="">
    <li class="first"><a href="/variis/opa">Opa</a></li>
    <li><a href="/variis/fire-tower">Fire Tower</a></li>
    <li class="last"><a href="/variis/dandelion-on-the-wind">Dandelion on the Wind</a>
    </li>
  </ul>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...