Rotation on FF and IE

[fulio pen]

Hello,

A rotation is included in the following web page. Please open it with
FF and IE. You will see the rotation is achieved on FF, but not IE:

http://www.pinyinology.com/shuangWen/shuangWen2b.html

The css code for the rotation is listed as below:

..rotate {
-webkit-transform: rotate(-270deg);
-moz-transform: rotate(-270deg);
-o-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-270deg);
filter: progidXImageTransform.Microsoft.BasicImage(rotation=3);
font-size:160%;
}

Help is appreciated for accomplishing the rotation on both the FF and
IE. Thanks for your expertise.


fulio pen

 

[123Jim]

Hello,

A rotation is included in the following web page. Please open it with
FF and IE. You will see the rotation is achieved on FF, but not IE:

http://www.pinyinology.com/shuangWen/shuangWen2b.html

The css code for the rotation is listed as below:

.rotate {
-webkit-transform: rotate(-270deg);
-moz-transform: rotate(-270deg);
-o-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-270deg);
filter: progidXImageTransform.Microsoft.BasicImage(rotation=3);
font-size:160%;
}

Help is appreciated for accomplishing the rotation on both the FF and
IE. Thanks for your expertise.

In your .rotate class
add:

display: block;
position: absolute;

Change:
filter: progidXImageTransform.Microsoft.BasicImage(rotation=3);
to
filter: progidXImageTransform.Microsoft.BasicImage(rotation=1);

Then you 'll need to play around with the absolute positioning to have the
text back where you want it.

 

[fulio pen]

In your .rotate class
add:

display: block;
position: absolute;

Change:
filter: progidXImageTransform.Microsoft.BasicImage(rotation=3);
to
filter: progidXImageTransform.Microsoft.BasicImage(rotation=1);

Then you 'll need to play around with the absolute positioning to have the
text back where you want it.

Hello,

I changed the code as advised. Now the file displays right on all IE,
FF and Chrome.

http://www.pinyinology.com/shuangWen/shuangWen2c.html

Thanks a lot four your help.

fulio pen