- 1). Enclose the text you wish to flip in a span tag.
Example: <span>Flipped text</span> - 2). Insert a Webkit transform command to flip the text for Safari users. Use -90 to have the text running from the bottom of the screen to the top, and 90 to have the text running from the top to the bottom. Use a semicolon to separate this command from the following browser-specific commands.
Example:
<span -webkit-transform: rotate(-90deg);>Flipped text</span> - 3). Insert a second transform code using Mozilla's browser-specific prefix.
Example:
<span -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg);>Flipped text</span> - 4). Insert a BasicImage filter to flip the text for Internet Explorer users. In this case, the rotation value 3 will run the text from bottom to top, and 1 will run the text from top to bottom.
Example:
<span -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);>Flipped text</span>
Source...