Ronde hoeken kan je op zoveel verschillende manieren verwezenlijken, de ene is al wat gecompliceerder dan de andere. Deze manier heeft 4 afbeeldingen nodig (voor elke hoek één), en 4 HTML elementen op ze op hun plaats te zetten. Eenvoudig en doeltreffend.

HTML

<div class="w1">
 <div class="w2">
  <div class="w3">
   <div class="w4">
    Hallo, tekst komt hier
   </div>
  </div>
 </div>
</div>

CSS

div.w1{
background:#9c6634 url(images/tl.gif) no-repeat;
width:100%;
width: 250px;
}
div.w2{
background:url(images/tr.gif) no-repeat top right;
}
div.w3{
background:url(images/bl.gif) no-repeat left bottom;
}
div.w4{
background:url(images/br.gif) no-repeat right bottom;
padding:10px;
}