Rounded corners add nice touch to look and feel of a Web Page. User interface that employs rounded corners looks more streamlined, more ergonomic. Often to achieve that effect images are used, but this approach doesn’t allow quick style update and has other issues. Fortunately there is another way:

Compare 2 following DIVs:


First uses pretty basic CSS/HTML:

<style type="text/css">
.normal
{
    border: solid 1px blue;
    background-color:yellow;
    height:100px;
    width:200px
}
</style>

<div style="text-align:center">
    <div class="normal">
</div>

Let’s take a closer look at the second: Continue reading →