bbrian, con css no hay manera de hacer bordes redondos sin que tengas algun inconveniente en cuanto a la compatibilidad con otros navegadores, ya que no todos los leen, pero hay una solucion a tu problema, espero que lo entiendas, tratare de explicarlo lo mejor posible, antes que nada neceitas crear dos imagenes en illustrator o photoshop o en el programa grafico que vos utilices, estas imagenes son la parte de arriba de la caja y la parte de abajo de la caja, es decir las dos partes donde se ven las formas redondeadas, se entiende?, a la parte de arriba la llamas top y a la parte de abajo bottom, con css uniremos esas dos imagenes y luego les daremos el alto que queramos, el codigo xhtml a utilizar ahora es el siguiente:
<div class="box">
<h2>Titulo de la caja</h2>
<p>contenido de la caja</p>
</div>
El codigo css:
.box {
width: xx px;
background: #000 url ( la ruta a la imagen bottom) no-repeat left bottom;
}
.box h2 {
background:url (la ruta de la imagen top) no-repeat left top;
}
O sea, lo que hicimos es lo siguiente se aplico la imagen que creaste (bottom) a la parte inferior del div, para crear el estilo de la caja añadis un color de fondo al div de la caja, despues aplicamos la imagen top al elemento de cabecera.-
si necesitas añadir algo de relleno a los elementos del div, podes hacer lo siguiente:
.box h2{
padding: xxpx xxpx xxpx xxpx;
}
.box p{
padding: xxpx xxpx xxpx xxpx:
}
No es para nada complicado, espero que hayas entendido lo de las imagenes que tenes que crear. Saludos.-