Skip to content Skip to sidebar Skip to footer
Home / Css / Javascript

Round Corners Text Area Box Either In Javascript Or In Css

Post a Comment
can anyone suggest me for a round corners text area box either in javascript or in css

Solution 1:

A "classic" way to do this, is using a background-image on a div around the textarea and setting border/outline of the textarea to none, like this:

<divstyle="background-image: url(image/with/rounded/corners.png);"><textareastyle="border: none; outline: none;"></textarea></div>

CSS3 supports rounded corners, but that is not well supported, see e.g. http://www.css3.info/preview/rounded-border/

EDIT: The answer was correct at that time, but border-radius in IE is only supported from version 9 on.

Solution 2:

I use jQuery Corner. It applies css3 corners to the browsers that support them and draws corners for the browsers that don't (IE).

Solution 3:

Rounded corners could be done with Rico: http://juixe.com/techknow/index.php/2006/08/10/rounded-corners-with-rico/, a JS library in addition to the JQuery plugin mentioned in the other post.

Or, you can do rounded corners with teh AjaxControlToolkit RoundedCornersExtender: http://www.asp.net/AJAX/AjaxControlToolkit/Samples/RoundedCorners/RoundedCorners.aspx

Post a Comment for "Round Corners Text Area Box Either In Javascript Or In Css"