Thursday, March 11, 2010

You are here: Home / Knowledgebase / Button round corners

Button round corners

January 29, 2009 by Geovani Martinez · Leave a Comment 

In the process of doing some GUI enhancements on an existing application I recalled wanting to implement some round corners on the submit buttons. They are to appear round, colorful and match the application theme.

image

So I created the CSS class below and assigned it to the button controls.

.submit
{
    font-size:10px;
    color:#FFFFFF;
    background-color:#640405;
    padding:3px 5px;
    border:1px solid;
    cursor:pointer;
    /* Rounded corners in most browsers! */
    -moz-border-radius: 5px; /* For Mozilla Firefox */
    -khtml-border-radius: 5px; /* For Konqueror */
    -webkit-border-radius: 5px; /* For Safari */
}

image

In the end its a good UI  enhancement to the application. The only one not rendering the corners round is IE but I can live with that.

Filed under Knowledgebase · Tagged with ,

Speak Your Mind

Tell us what you're thinking...
and oh, if you want a pic to show with your comment, go get a gravatar!

You must be logged in to post a comment.