html5 textarea无法在智能设备中伸展

I'm using an html textarea in one of my html pages. I'm using html5 boilerplate template. The pages can be viewed with out any problem in any device. But the textarea element cannot be stretched. The even the pattern at bottom right-hand corner in every textarea (which indicates that it can be stretched further) is not visible as well.

For further clarifications here's how the page looks like in PC (Chrome) and iPhone (safari). Output from Chrome browserOutput from Chrome browser image from IphoneOutput from Iphone Safari

You can see the textarea is showing differently on two devices. Also this shows the same behaviour in android devices as well.

Here is my code

echo("  <form method=\"post\" action=\"".$_SERVER['PHP_SELF']."\">
<text>Content name: </text><input type=\"text\" name=\"content_name\"/>
<text>Content type: </text><input type=\"text\" name=\"content_type\"/>
<text>Content value: </text><textarea cols=\"60\" name=\"content_value\" name=\"content_value\"></textarea>
<text></text><input class=\"submitbtn\" type=\"submit\" value=\"submit\" name=\"submit\"></input>
</form></div>");

Please tell me if I'm doing anything wrong. Thanks in advance.

You could remove cole="\60\" and set it using css like style="width: 100%;"

In order to stop chrome from showing the resize, you can add this to your style of the textarea element:

style = "resize: none;"

so you get

<textarea style=\"resize: none;\" cols=\"60\" name=\"content_value\" name=\"content_value\">