I want to write text with Bootstrap, vertically but not like transform the text 90°. Vertical, but turned and hard to read.
But actually written like this: Vertical and not turned
I think there was a way to do this with Bootstrap? Do you know something?
To achieve a vertical text orientation, set the writing mode property to vertical-lr(or vertical-rl) and set text-orientation to upright.
The text-orientation CSS property sets the orientation of the text characters in a line. It only affects text in vertical mode (when writing-mode is not horizontal-tb ). It is useful for controlling the display of languages that use vertical script, and also for making vertical table headers.
The first trick is to use writing-mode: vertical-lr to get the text to run vertically. By itself, the text runs top to bottom, but we want it to run bottom to top, so we spin it around it with the transform: rotate(180deg) . The default transform origin is the center of the element, so this works out great.
Text Alignment The text can justified by using the . text-justify class and for left, right, and center alignment of text, use the text-left, text-right and text-center classes respectively.
You can do something like this:
CSS
.verticaltext{
width:1px;
word-wrap: break-word;
white-space:pre-wrap;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With