Tuesday, April 24, 2012

CSS for Rounded Corner TextBox


A simple example for implementing rounded corner on TextBox using CSS.
 <style type="text/css">

.roundedbox {
    background:#fff;
    font-family:Verdana,Arial, Helvetica, sans-serif;
    font-size:10pt;
    margin-left:auto;
    margin-right:auto;
    margin-top:1px;
    margin-bottom:1px;
    padding:3px;
    border-top:1px solid #CCCCCC;
    border-left:1px solid #CCCCCC;
    border-right:1px solid #999999;
    border-bottom:1px solid #999999;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
}

 </style>

<asp:TextBox ID="TextBox1" runat="server" CssClass="roundedbox" Width="300px">

And here the output :

4 comments: