This is not at all difficult. Let's say you have a div and would like to have the left corners (top left and bottom left) to be round and leave the right side as is. In the example style below let us assume that the div's id in question is "content".
The radius determines how round you want the corners to be. The higher the value the more round it is. Also, the value can be expressed in either px or %. The properties, border-top-right and border-bottom-right are also available.
If you would like all corners to have the same value, there is no need to be redundant by writing each of these. Simple do:
However, ensure that it works in other Firefox and other browsers you must use the prefixes -moz-, and -webkit- like so:
So far, about only 5 browsers (Firefox 4 +, Opera, Safari 5+ and IE 9 +) supports these properties.
Furthermore, you may run into situations where these properties may not work at all or not as perfectly cross-browser-wise. To solve this you can use CSS3 PIE. Note that if your page is using JQuery, these properties will work fine and there is no need to use CSS3 PIE at all. Hope this helps!