45 degree text on web

I have a need to display some dynamic text at a 45 degree angle for a web application I’m writing. I’ve looked through the forum and did a few google searches with nothing coming up outside of the desktop methods using StringShape. What I’ve also found is that Xojo web appears to not support the ability to use Object2d, therefore I can not apply the example from https://documentation.xojo.com/index.php/StringShape (DrawObject does not exist).

Does someone have a suggestion that might solve my dilemma?

Thank you in advance…

https://www.w3schools.com/cssref/css3_pr_transform.asp

  • Insert a new Webstyle
  • Call it “rotated”
  • Put this in app.HTMLHeader :

<style> .rotated { -ms-transform: rotate(-45deg) ; /* IE 9 */ -webkit-transform: rotate(-45deg) ; /* Chrome, Safari, Opera */ transform: rotate(-45deg) ; } </style>

  • Apply the rotated style to any webcontrol.

So there is no built in Xojo function to do this directly like there is for the desktop app?

Probably not what you want, but a WebAnimator could do it.

I just did some testing on what you suggested Michel…and holy sh**, I had no idea this was even possible. I’ve been fighting/compromising with the Xojo styles and elements over the last couple of applications to get it to do what I want. All this time, I could have simply done this and it would have saved a BUNCH of time. Thank you Michel!!

I’ll look at the WebAnimator as well Paul to see if that would be another potential solution to the problem.

Indeed WebAnimator can also rotate controls. Not sure it will be as simple, though.