Click to See Complete Forum and Search --> : Tables with round corners


jacknbey
10-17-2008, 02:11 PM
There are many HTML web page design comes with table with 4 round corners. I find it particularly troublesome to put up 4 corners manually.

Is there any particular software which can generate such round corner table automatically?

Appreciate any advice.

lpc
10-20-2008, 09:46 PM
I'm not sure if there is software to handle that task because I would do it manually. I would imagine that there is since there seems to be software for every task these days. Its not actually very hard to get the rounded corners effect. If you give me some more information on how you want it to look I could help you.

tracknut
10-21-2008, 09:33 AM
I've used the Javascript "Nifty Corners" (Google it) to make rounded corners on things. Not sure I've ever done it to a table, but it might work there as well.

Dave

coothead
10-21-2008, 11:27 AM
Hi there jacknbey,

border-radius is in the CSS3 draft...
http://www.w3.org/TR/css3-background/#the-border-radius
...and is already supported by Firefox and Safari. I would hazard a guess that Opera will also support it soon.
As for IE, well........don't hold your breath. ;)

Here is an example that works in Firefox and Safari...

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">

<style type="text/css">
#table1 {
border:2px solid #000;
-moz-border-radius:25px;
-webkit-border-radius:25px;
margin:auto;
background-color:#f96;
}
#table1 td {
width:324px;
height:200px;
border:1px solid #000;
-moz-border-radius:21px;
-webkit-border-radius:21px;
text-align:center;
background-color:#fc9;
}
</style>

</head>
<body>

<table id="table1"><tr>
<td>table cell</td>
</tr></table>

</body>
</html>

coothead