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.

Related Articles

WordPress

I started using WordPress today, and I'm impressed! To view old site, go to: http://radulski.net/museum/

CSS Column Layout

When working on websites, one of the most common patterns is column-layout. You want have some main content flow in the center of the page, and have one or two...

Hide Button Text

There is a simple, but genius, method to replace button with icon. I learned it from jQuery. First, create the button, as you would always do. You can use <button>...