css and tables

[mahagonny]

Hello to all and excused my English bad one. I would want to obtain this (http://icant.co.uk/csstablegallery/index.php?css=29#r29) effect but I would not know like making because if I apply the css to the table I obtain this (http://www.tsnbari.it/index.php?option=com_content&task=view&id=164&Itemid=27) result.
How it is resolved? Thanks

[Sliight]

You appear to be getting the exact same result, and it appears to be working correctly. It's just that your lists/tables are different sizes.

[mahagonny]

You appear to be getting the exact same result, and it appears to be working correctly. It's just that your lists/tables are different sizes.

:confused:

[Sliight]

To get help here, you may want to try and describe the problem in more detail.

I looked at both pages, and both pages both hover blue, the only difference I see is that one is clean with consistent sizing, and yours is not.

[mahagonny]

this is the code css and the HTML. The CMS is Joomla written in php

<style type="text/css">

<pre>/* ---- ( iTunes CSS ) ---- */
.commentbox {
}
table {
font: 80&#37; Verdana, Arial, Helvetica, sans-serif;
color: #000;
text-align: left;
border-collapse: collapse;
border: 1px solid #666666;
border-top: none;
}
table a {
text-decoration: underline;
}
table a:visited {
text-decoration: none;
}
tr.odd {
background-color: #ebf3ff;
}
tr a {
color: #000000;
}
tr:hover a {
color: #ffffff;
}
tr:hover, tr.odd:hover {
background-color: #3d80df;
color: #ffffff;
}
caption {
height: 45px;
line-height: 44px;
color: #60634E;
font-weight: bold;
text-align: center;
width: 100%;
margin: 0;
padding: 0;
background: #ffffff url('captop.jpg') no-repeat 50% top;
border-left: 2px solid #616161;
border-right: 2px solid #616161
}
thead th {
font-size: 105%;
color: #000;
background: #ffffff url('tbar.gif') repeat-x;
height: 33px
}
thead th:hover {
background: #ffffff url('tbov.gif') repeat-x;

}
tr {
vertical-align: top;
}
tr, th, td {
padding: .75em;
}
td {
border-left: 1px solid #dadada;
}
tfoot tr {
background: #fff url('bbar.gif') repeat-x;
}
tfoot td, tfoot th{
color: #000;
border: 0px;
}</pre>
</style>
<div class="commentbox">
<table border="1" cellspacing="0" width="100%" id="AutoNumber1">
<tr>
<td width="25%" style="border-style: solid; border-width: 1">asdadasdasd</td>
<td width="25%" style="border-style: solid; border-width: 1">kljl&#242;kj</td>
<td width="25%" style="border-style: solid; border-width: 1">&#242;lkjl&#242;kj</td>
<td width="25%" style="border-style: solid; border-width: 1">lkjlkjlj</td>
</tr>
<tr>
<td width="25%" style="border-style: solid; border-width: 1">jl&#242;&#242;lkj&#242;l</td>
<td width="25%" style="border-style: solid; border-width: 1">&#242;lkj&#242;lkj&#242;k</td>
<td width="25%" style="border-style: solid; border-width: 1">&#242;lkj&#242;lkj&#242;</td>
<td width="25%" style="border-style: solid; border-width: 1">lj&#242;lj</td>
</tr>
</table>
</div>