CODEWITHSUNDEEP
htmlcss
gtilflm
gtilflm

Reputation: 1465

Width of Table Cell with Rotated Text -- HTML

I have some vertically-oriented text in a table cell. However, the cell seems to be taking the width of the text as if it were horizontally oriented and I want it to take on the width of the vertically oriented text.

What I have: http://jsfiddle.net/a20rp5y3/

What I'm going for: http://jsfiddle.net/p4EPd/ (the "Overall Satisfaction" column specifically)

It seems that position: absolute is the key here, but I don't know how to implement it in my example.

Thoughts?

Upvotes: 0

Views: 60

Answers (1)

Amit
Amit

Reputation: 46323

That 2nd sample is "cheating" you to think it works. Replace the contents of the to lower TDs (below the satisfaction cell) to something short like '|' and you'll see it doesn't really work.

The reason is that CSS transforms don't affect bounding box calculations. You need to set your sizing properties "by hand".

Upvotes: 1

Related Questions