Teaching and Learning...

This is the styling for the <div> on this page:

Note that the background repeats, and that the box is styled with a percentage value.

Style for this div:

margin: 20px auto;
color: #fff;
width: 500px;
height: 550px;
padding-left:2em;
background-image: url(backtest.jpg);
background-repeat: no-repeat;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;

This is the styling for this div:

  margin: 0.2in auto;
  color: #fff;
  width: 60%;
  padding: 20px;
  text-align: left;
  background-color: #33F;
  -webkit-border-bottom-right-radius: 20px;
  -webkit-border-top-left-radius: 20px;
  -moz-border-radius-topleft: 20px;
  -moz-border-radius-bottomright: 20px;

You don't have to round all the corners of a box. There are some constraints, mostly common sense, about box styling. For example, it makes no sense to style a box with rounded top corners, a top border but no side border; and the results can be relied upon to look odd!

You can of course have rounded top corners with a border to left, top and right (but none on the bottom). That is how the tabs are styled.