views:

2781

answers:

8

PHP - How to display vertical text (90 degree rotated) in all browsers in php?

A: 

This thread suggests that you can write text to an image and then rotate the image.

It appears to be possible with IE but not with other browsers so it might be one of those little win for IE6 =)

Eric
IE can do it with an IE-only proprietary tag. Most other major browsers (Firefox, Safari, Opera, etc.) can do it with an open web standard: SVG. (Released 2001, still zero support from Microsoft.) I'm not seeing any win for IE here. :-)
Ken
A: 

imagettftext oughta do the trick.

Hexagon Theory
+4  A: 

I don't think you can rotate text with PHP/HTML/CSS. But you can create an image with GD containing vertical text.

Example:

header ("Content-type: image/png"); 

// imagecreate (x width, y width)
$img_handle = @imagecreatetruecolor (15, 220) or die ("Cannot Create image"); 

// ImageColorAllocate (image, red, green, blue)
$back_color = ImageColorAllocate ($img_handle, 0, 0, 0); 
$txt_color = ImageColorAllocate ($img_handle, 255, 255, 255); 
ImageStringUp ($img_handle, 2, 1, 215, $_GET['text'], $txt_color); 
ImagePng ($img_handle); 
ImageDestroy($img_handle);
tharkun
+1  A: 

As far as I know it's not possible to get vertical text with CSS, so that means that the rotated text has to be in an image. It's very straightforward to generate with PHP's' libgd interface to output an image file.

Note however that this means using one script to produce the image, and another to produce the surrounding web page. You can't generally (inline data: URI's notwithstanding) have one script produce more than one page component.

Alnitak
+6  A: 

The problem is independent from the server side language. If it's not a problem when the vertically rendered text isn't text anymore but an image, choose the solution provided by tharkun. Otherwise, there are ways to do it in the presentation layer.

First, there's (at the moment) an IE-only solution, which is part of the CSS3 standard. You can check it live.

p {
    writing-mode: tb-rl;
}

The CSS3 text module also specify some properties for text orientation.

Other guys do it with SVG.

Török Gábor
A: 
   function verticletext($string)
    {
       $tlen = strlen($string);
       for($i=0;$i<$tlen;$i++)
       {
            echo substr($string,$i,1)."<br />";   
       }
    }
nitin handa
A: 
function verticletext($string)
    {
       $tlen = strlen($string);
       for($i=0;$i<$tlen;$i++)
       {
            $vtext .= substr($string,$i,1)."<br />";   
       }
       return $vtext;
    }

there you go no echo

sourceboy
A: 

Text rotation is also possible with other browsers.

CSS:

/*Safari*/
-webkit-transform: rotate(-90deg);

/*Firefox*/
-moz-transform: rotate(-90deg);

/*Opera*/
-o-transform: rotate(-90deg);

/*IE*/
writing-mode: tb-rl;
filter: flipV flipH;
mark