| <!DOCTYPE html> |
| <html><head> |
| <meta charset="UTF-8"> |
| <style> |
| .middle { vertical-align: middle; } |
| </style> |
| </head><body> |
| The table should not overflow its contents, and 1st table and 2nd table look same. |
| <table border="1"> |
| <tr><td><span class="middle" style="-webkit-writing-mode: vertical-rl; width: 100px; background-color: red;">vertical text</span> |
| </table> |
| <table border="1"> |
| <tr><td><div style="-webkit-writing-mode: vertical-rl; width: 100px; background-color: red;">vertical text</div> |
| </table> |
| </body></html> |