ansaurus

Question

Using text-transform on an input element actually transforms the text?

Answer 1

A:

Well, if all the major browsers do actually transform the field contents, then your concern is of only philosophical interest. One could argue that for input fields (as opposed, say, to <h1> elements) having the on-screen appearance of user-typed text be different than what's actually submitted would be pretty unfriendly and confusing.

edit Testing browsers now ...

Chrome 4 on Windows applies the style visually but submitted text is not changed
Firefox 3.6 on Windows applies the style visually but submitted text is not changed
IE8 applies the style visually but submitted text is not changed

I am therefore starting to wonder what it is that makes you think that the posted field contents are converted by the CSS rule.

Pointy 2010-03-02 12:40:36

Answer 2

+2 A:

Test code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
<html>
<head><title></title>
<style type="text/css"><!--
textarea, input{
    text-transform: uppercase;
}
--></style>
</head>
<body>

<?

if( !empty($_POST) ){
    echo '<pre>' . htmlspecialchars(print_r($_POST, TRUE)) . '</pre>';
}

?>


<form action="" method="post">
    <textarea name="textarea" rows="3" cols="40">Default</textarea>
    <input name="text" value="Default">
    <input type="submit">
</form>

</body>
</html>

Interesting findings:

Opera 10 ignores text-transform: uppercase in textareas
Chrome 4 sends a GET request for the POST form
None of the browsers I've tested (Windows XP) feature the behaviour your describe: Firefox 3.6, IE 6, IE7, IE8, Opera 10...

IMHO there's a great chance that you're using JavaScript...

Álvaro G. Vicario 2010-03-02 13:06:11

I'm having trouble recreating the scenario as well. I do remember having to manually modify a bunch of files that had been edited using input or textarea fields that had text-transform set to uppercase, a couple of which were not even edited by me. Maybe I did just have a script somewhere interfering with it that's not there anymore...

animuson 2010-03-02 18:20:58

ansaurus

tags:

views:

answers:

Using text-transform on an input element actually transforms the text?

related questions