Vertically flowing text with css
I would like to have a div with some text in it. But I'd like the text to flow vertically instead of horiz开发者_开发技巧ontally. Like this;
M
y
t
e
x
t
Any ideas on how to accomplish this with CSS?
If you have only one line of text you could try using width:1em;letter-spacing:1px
(and a space between each letter)
edit: if you want to use no space between each letter width:1em;letter-spacing:1em;word-wrap:break-word
CSS3 has a proposed 'writing-mode' attribute that can be set to 'tb-lr' (write text from top to bottom, write lines from left to right), but I don't know if any browsers support it yet, so its not something to rely on.
div{
text-orientation: upright;
writing-mode: vertical-lr;
}
<div>Jelly</div>
Please find the answer here you can use text-orientation and
.yourtext { -moz-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
-moz-transform-origin: top right;
-webkit-transform-origin: top right;
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
精彩评论