Deze round corner procedure heeft geen afbeeldingen nodig om de ronde hoeken te maken. Alleen een paar css-regels en een paar html-regels. Om ook in IE de afbeeldingen van ronde hoeken te voorzien, is er gebruik gemaakt van een htc-file. Download de rond.htc en plaats die in de directory waar de round-corners-pagina staat (of verander in de css-code bij behavior:url het pad naar de plek waar rond.htc staat). Plaats de css-code in de head-sectie van jouw pagina en de html-code in de body-sectie op de plaats waar de afbeelding gewenst is. Om zo min mogelijk http-requests te veroorzaken is in de code een data:image/png;base64 gebruikt. Maar desgewenst kan je ook een transparante gif voor de src gebruiken
<style type="text/css" media="screen">
img.ronde_hoek{
border-radius:30px;
-moz-border-radius:30px;
-khtml-border-radius:30px;
-webkit-border-radius:30px}
img.ronde_hoek:hover{
border-radius:25px;
-moz-border-radius:25px;
-khtml-border-radius:25px;
-webkit-border-radius:25px}
</style>
<!--[if lt IE 9]>
<style type="text/css">
img.ronde_hoek{
behavior:url("rond.htc")}
</style>
<![endif]-->
<p>
<img class="ronde_hoek" style="background:url(de_naam_van_jouw_afbeelding.jpg);" width="160" height="240" src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEUAAACnej3aAAAAAXRSTlMAQObYZgAAAApJREFUCJljYAAAAAIAAfRxZKYAAAAASUVORK5CYII=' />
</p>