*You could probably also want to read the second version of this article here

Did you ever want a fancy textbox like this one ?

Rounded-border textbox

I’m sorry, but HTML and CSS does not support this kind of appearance. You should use a trick in order to look like this by creating a background with a rounded textbox drawn. Then you should create a html textbox input with no border, smaller than the drawn textbox.
The CSS style for this textbox is the following:

.textbox {
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 11px;
        margin: 0px;
        padding: 2px;
        border: 0px none;
        width: 150px;


Read also

Leave a Reply