CSS for table appearing differently on Firefox Chrome

Hello,

Please visit: http://www.greek-concierge.com/benefits

The first row in the tables appears much larger than it should be in Firefox and Chrome.

It looks fine in IE.

Here is the CSS i am using:



table.gridtable {
font-family: verdana,arial,sans-serif;
font-size:11px;
color:#d1d1d1;
border-width: 1px;
border-color: #383838;
border-collapse: collapse;
}
table.gridtable th {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #383838;
background-color: #232323;
}
table.gridtable td {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #383838;
background-color: #000000;
text-align: left;
}



any help?

thanks a lot
Andy

table.gridtable th {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #383838;
background-color: #232323;
}



table.gridtable th {
border-width: 1px;
padding: 0 8px;
border-style: solid;
border-color: #383838;
background-color: #232323;
}


the differences in how it look come mainly from invalid markup:

http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.greek-concierge.com%2Fbenefits

try to fix it.

best regards

Hi oesxyl,

I tried your suggestion and this fixes Firefox and Chrome but it messes up IE. the height is too narrow now on IE.

thanks for the help
Andreas

Hi oesxyl,

I tried your suggestion and this fixes Firefox and Chrome but it messes up IE. the height is too narrow now on IE.

thanks for the help
Andreas
yes, but you didn't validate that means each time you fix something you have big chances to break something else. :)
About IE differences, must be a box model problem and depend of the ie version, i would use conditional comment to add new style for ie.

http://htmlfixit.com/contribs/MS_conditional_tags.html

at the end of the page there is a link to another way to solve this.

best regards