移动端日文竖排显示问题

Question

所以我有这个问题我正在努力解决.. 我在某个表格中得到了一些文本，我希望当用户从移动设备访问页面时它以垂直方向显示，因为它是一个很长的文本，更适合垂直。

现在这是我的代码：

<style>
@media only screen and (max-width: 768px) {
ul.vert_text {
    text-orientation: upright;
    text-align: justify;    
    word-wrap: break-all;
    writing-mode: vertical-rl;
  }
  }
</style>
<table>
<tbody>
<tr>
<td>ダミーテキスト</td>
<td>ダミーテキスト</td>
<td>ダミーテキスト</td>
</tr>
<tr>
<td>ダミーテキスト</td>
<td>
<ul class="vert_text">
        
     <li>ダミーテキストダミーテキスト</li>
     <li>ダミーテキストダミーテキスト</li>
     <li>ダミーテキストダミーテキストダミーテキストダミーテキスト</li><br>
     <li>ダミーテキスト</li>
        
</ul>
</td>
<td>
<ul class="vert_text">
        
     <li>ダミーテキスト</li>
     <li>ダミーテキストダミーテキストダミーテキスト</li>
     <li>ダミーテキストダミーテキスト</li>
        
</ul>
</td>
</tr>
<tr>
<td>ダミーテキスト</td>
<td>
<ul class="vert_text">
        
     <li>ダミーテキスト</li>
     <li>ダミーテキストダミーテキスト</li>
     <li>ダミーテキストダミーテキストダミーテキストダミーテキスト</li>
        
</ul>
</td>
<td>
<ul class="vert_text">
        
     <li>ダミーテキストダミーテキスト</li>
     <li>ダミーテキスト</li>
     <li>ダミーテキストダミーテキスト</li>
     <li>ダミーテキストダミーテキストダミーテキスト</li>
        
</ul>
</td>
</tr>
</tbody>
</table>

当我在模拟手机屏幕的电脑浏览器上尝试时，文字没有问题，但是当我在iphone上用safari尝试时，它不能正常显示（它溢出表格并且不垂直显示，但从右到左） 可能是什么问题？

Answer 1

您可以尝试： -webkit-text-orientation：直立； -webkit-writing-mode: vertical-rl;