Stretchy rounded corner borders without tables

Posted on by

It is not a straightforward process to create a rounded corner border in css that stretches both horizontally and vertically, and won’t look bad when the page gets too small, AND also looks good in Firefox for Mac and PC, Safari for Mac, and IE for PC.

Here is one solution:

Click this link to view example

This is based on Example 5 of
Creating Liquid Layouts with Negative Margins
by Ryan Brill

see also: “Tables stretch beyond borders of floated divs in IE for PC”