HTMLで表作成を行う際の縦書き表示について

Question

前提・実現したいこと

HTMLを使用して表を作成しています。
表の中の一つのセルだけを縦書き表示にしたいと思い
対象のセルに<p style="writing-mode: vertical-rl;">を入れています

発生している問題・エラーメッセージ

実行すると一応縦書きにはなっているようですが、1文字ごとに改行されており、見た目的には横書きのようになってしまいます。

該当のソースコード

<table>
       <tr><td>
           <p style="writing-mode:vertical-rl">縦書きテスト</p></td>
           <td>横書き</td></tr>
       </table>

試したこと

縦書きにしたい対象を半角英数にするとうまくいくが
日本語だとうまくいかない

補足情報（FW/ツールのバージョンなど）

Google Chromeを使用して動作確認しています。
超初心者ですが何卒よろしくお願いします。

Answer 1

高さを指定するか、折り返さないようにしてみてはどうでしょうか？

td p {
  white-space: nowrap;
}

https://developer.mozilla.org/ja/docs/Web/CSS/white-space

Comments

[fukuromomonga]

うまくいきました！こんな初歩的なことにも丁寧に回答して頂きありがとうございました！