Display array vertically using CSS - vertical-lr

HTML-CSS
1

Hi Guys,
Need your help in diaplaying this array vertically:

<h1 className='vericaltext'>{[1,2,3,4,5,6,7,8,9,10]}</h1>

using this:

.vericaltext {
  display: inline-block;
  margin-right: 6px;
  background-color: #EEE;
  writing-mode: vertical-lr;
  text-orientation: upright;
}

what it does is diplay the last index which is 10 as:

1
0
and i need 10 to be in the same line.

Anyone got an idea how to solve this issue?

Thanks !

2

i am not to sure what your problem is but take a look at this website:

do you mean like this?

<!DOCTYPE html>
<html>
<style>

h1 {
    writing-mode: vertical-rl;
text-orientation: mixed;
}
</style>
<body>
<h1 class='vericaltext'>{[1,2,3,4,5,6,7,8,9,10]}</h1>
</body>
</html>
3

Thanks for your reponse,

I need the array to be diaplayed like this:

1
2
3
4
5
6
7
8
9
10

and not like this :

1
2
3
4
5
6
7
8
9
1
0

Thanks !

4

hmm, ok ill try and help.

5

you will need to make a new h1 *add the text 1 2 3 etc…) with a class if you want and then go to your styles and make an h1 style (if you have a class what that name is) and the opening and closing brackets ({}) then add

  1. writing-mode to vertical-rl

  2. text-orientation to upright

that should be it…

6

was that your answer? cos i can look for another way

7

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.