How do I make corners rounded only on the top part of the border in css? [closed]

Answer 1

border-top-left-radius: 3px;
border-top-right-radius: 3px;

Answer 2

The other answers are correct but there is the shorthand solution:

border-radius: 3px 3px 0 0; 

which will round only the top corners and leave the bottom ones alone. The order of the values is clockwise - top left, top right, bottom right, bottom left.

Here's an example: http://jsfiddle.net/9sXWf/

Answer 3

Brendan's answer is correct, but to get it to render in more browsers, you should use this:

-moz-border-radius: 0px;
-webkit-border-radius: 3px 3px 0px 0px;
border-radius: 3px 3px 0px 0px;