Pure CSS Rounded Corner, No Images

• Tweet

• Tweet

Though it does look great, I haven’t given it a try until the other day when I was developing smartbabynames.com. Notice the previous and next link immediately below the boy image at here:

http://www.smartbabynames.com/meaning/boy/Langleigh/

They look and feel great.

So here’s what I’ve done to achieve the rounded corner box in pure CSS — no images nor whatever. Just CSS:

.rounded {
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;
	border-radius: 2px;
}

Tested across major modern browsers other than IE. Sure it doesn’t work in IE6, but not sure if it works in IE7, IE8, IE9, etc. But let me know if you know.