Sunday, January 30, 2011

Rounded Corner

It's simple to make rounded corner with pure CSS style. This is just a different implementation between browser.
In firefox, it's like this one:

h1 {
    border: 1px solid blue;
    -moz-border-radius-topleft: 4px;    /* top left corner */

Do like the above with these code:
-moz-border-radius: 4px    /* all corner */
-moz-border-radius-bottomleft: 4px    /* bottom left */

For Safari and Chrome:
-webkit-border-radius: 4px    /* all corner */
-webkit-border-radius-bottomleft: 4px    /* bottom left */

No specified browser:
border-radius: 4px    /* all corner */
border-radius-bottomleft: 4px    /* bottom left */


No comments:

Post a Comment