Lea Cohen Lea Cohen -5 years ago 99
HTML Question

Is there a way to rotate text input?

I have to align a textbox and some text, at about 30 degrees, like this:
rotated text

I would like it to work at least in IE and FF.

everything I found on the net deals with image rotation.


Answer Source

There's no good cross-browser solution.

Latest Webkit supports CSS transformations, that allow such thing in straightforward way.

There's <foreignContent> in SVG that theoretically would allow to rotate HTML, but it's not widely supported (and where it's supported, it's usually incomplete and buggy).

I suggest that you change design of the page. Try visual tricks with borders and shadows around the input that make it seem slightly rotated.

I advise against hacks in Javascript or Flash. Browser's input elements are important for usability. Your hacks may not play well with password managers/autofill, various standard keyboard shortcuts, text selection, etc.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download