Table based infobox:
html:
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;
}
