CSS Rollover Problem

netscape displays incorrectly

Junior Member

I've created a template for a current project that utilizes CSS rollovers to create a button effect in browsers that support it.

Basically, it utilizes the hover pseudo-class to change the background color of the div, and display: block to fill the table cell.

Oddly enough, the buttons look fine in the left column, but they overlap the edges of the table in the right column when viewed with netscape or mozilla. Internet Explorer renders both columns perfectly.

I'd appreciate it if anyone with CSS experience would take a look - the source code on the page is broken down and commented to make it easy to see the structure.

Here is the link, or if links are not allowed in this forum, you can get to this page through my profile: