Rotated Element Height and Width

Question

I have a text element with textContent "Design", that was transformed with css to be rotated 45 degree. So it get rotated, but the problem is how to get the height of the rotated element. pls refer the img

Rotated

Initial Position

I need the height and width of the box containing the text

Thanks Gowri

score 0 · Accepted Answer · edited May 23 '17 at 10:32

0

Check This overflow for a pretty good solution. The bounding box will be the outside dimensions of your rotated object.

EDIT: I should add, this is essentially the same answer as above, but it gives you a bunch of other metrics to go along with your rudimentary bounding box.

edited May 23 '17 at 10:32

Community

1
1

answered May 24 '13 at 19:51

user2009125

76
3

score -1 · Answer 2 · answered May 24 '13 at 09:51

If you've got a rectangle that's not rotated at all (lines are perfectly horizontal/vertical) with width = w and height = h, then you rotate it by 45 degrees, it should be possible to draw a square which contains this rectangle with width/height = x.

I work out that the size of x in relation to w and h should then be:

x = sqrt(pow(w, 2) / 2) + sqrt(pow(h, 2) / 2)

Hope that's what you were looking for =]

Rotated Element Height and Width

2 Answers2