HTML Element Table - Rotate

Hi All

I've been using the new HTML element plugin, more specifically the HTML table example.

It's great! I've managed to implement it into my game pretty seamlessly.

However I wish for the table to be rotated 270 degrees on occasion.

I've used 'transform: rotate(270deg)' which does rotate the table contents. (see below code)

.resultstable {
	width: 100%; /* Fill up the width of the HTML element */	
	border-collapse: collapse;/* Allow cell borders to collapse */
	transform: rotate(270deg);

However for the life of me I can't figure out how to change the size to match the HTML element at this new angle. The 'Width: 100%' command sets the size based on the table before the rotation. I've tried putting it after the rotate command, but it hasn't made a difference.

I've tried loads of other things and scoured Google search but to no avail.

I know this is more of a CSS question rather than construct! But any help much appreciated.

See below image of what the table looks like after rotation.

Thanks!

Add this to your css

.resultswrap2 {
	font-family: Arial, sans-serif;	/* Match Arial on the Text object */
	border: 1px solid black;		/* Add a black border */
	overflow-y: auto;
	transform: rotate(270deg);

Then add something like.

Hi Sizcoz

Ah this does actually work a lot better! Thanks!

However if the element is not square, it means that it is likely it will no longer fit the viewport after the rotate. Still looks like below:

I've tried changing the size after the rotate, but that doesn't seem to help.

Any thoughts?

Thanks!