Round corners

There’s got to be a 1000 hacks to add round corners to a website block. The most popular and flexible one is to have 4 elements:


<div class="block">
<h3>Header</h3>
<div class="content">
<p>...</p>
</div>
</div>

Now, you can set 4 backgrounds, 1 for each corner.

It is a bit easier to use pure CSS code, but this doesn’t work in IE.


border-radius: 15px;
-moz-border-radius: 15px;


For most flexible, easiest solution, use JavaScript. There are some great plugins that let you create stunning corner effects with a single line of code.