Table based infobox with css3

Table based infobox: html:

<table><thead><tr>
<th>Attribute</th><th>Value</th>
</tr></thead><tbody>
<tr><td>width</td><td>100px</td></tr>
<tr><td>title</td><td>text</td></tr>
<tr><td>colspan</td><td>4</td></tr>
<tr><td>rowspan</td><td>2</td></tr>
</tbody></table>

<table><thead><tr><th>
 Title
</th></tr></thead><tbody><tr><td>
<ul>
  <li>First element</li>
  <li>Second element</li>
  <li>Third element</li>
  <li>Fourth element</li>
  </ul>
</td></tr></tbody></table>

css (part of Reset.css included):

* { /*** Reset start ***/
 padding:0;
 margin:0;
 font-family:Tahoma,Verdana,Arial;
 font-size:100%;
}
ul {
 list-style:disc outside;padding-left:25px;
}
table {
 border-spacing:0;
 border:1px solid #666;
}
body {color:#333;}
/* Reset end */
table {
 margin:20px;
 width:10em;
 
 background:#ace;
 background: -moz-linear-gradient(top,#eff,#ace 7%, #ace 90%,#777 );
 background: -webkit-gradient(linear, left top, left bottom,  color-stop(0,#eff), color-stop(0.07, #ace), color-stop(1,#777));

 -moz-border-radius:.6em;
 border-radius:.6em;
 
 -webkit-box-shadow: .4em .4em .4em rgba(0,0,0,0.5);
 -moz-box-shadow: .4em .4em .4em rgba(0,0,0,0.5);
 box-shadow: .4em .4em .4em rgba(0,0,0,0.5);
}
 
table th {
 padding:.4em;
 text-align:center;
 border-bottom:1px #888 solid;
 background-color:transparent;
 text-shadow: .06em .06em .1em rgba(0,0,0,0.5);
}
table td {
 background:#fafafa;
 padding:.5em;
 border:1px #888 solid;
}
table tr:last-child td:first-child {
 -moz-border-radius-bottomleft:.5em;
 border-bottom-left-radius:.5em;
}
table tr:last-child td:last-child {
 -moz-border-radius-bottomright:.5em;
 border-bottom-right-radius:.5em;
}