Vertical Right to Left aligned Text

[kshibata]

Hi,

I’d like to add Japanese text to a website that is styled vertical (top to bottom) and right to left.
I tried using the CSS code:
p {
writing-mode: vertical-rl;
text-orientation: upright;
}

One problem was that the text would move when scrolling the page.

Appreciate your help.

[friech]

Hi @kshibata,

Thank you for writing in, but sorry I am not entirely certain of your issue.

Please clarify what do you mean “the text would move when scrolling the page.”? It sounds normal to me.

Thanks,

[kshibata]

Hi @friech,

Apologizes, I see how this wasn’t descriptive enough. Of course as you scroll down the page, the text will move up the page. With the Japanese content, however, text from one line will shift to another line when scrolling, as if the margin width is changing with scroll.

Hope this is more clear.
Thanks.

[christopher]

Hi @kshibata,

We do apologize as we do not have experience with that kind of scripts from top to bottom and then Right to left. Would you please kindly get back to us with the URL of the exact page that you are talking about?

I am mostly certain that we do not support top to bottom scripts, but maybe there are a CSS trick here and there that we can search for you and suggest.

I tried to check your licenses page and you have many websites and I am not sure which page of which website you are talking about.

Thank you.

[kshibata]

Hi and thanks.

Please see this page: https://genkiway.com/vertical-text-test/

Thanks again

[christian]

Hey @kshibata,

I watched the Japanese texts closely as I scrolled the page but I didn’t see any shifting. Would you mind watching the recorded video in the Secure Note and point us out to the time the text shifted because I might be missing something?

If you don’t see anything shifting in the video, would you mind recording your screen as you scroll and also give us the name and version of your Operating System and browser as this might be specific to it.

Thanks.