I have written a tab component that allows for each tab to be in one of four states:
I have created a CSS style for each of the four states. The tabs are rendered using UL/LI tags. When enabled a A link tag is rendered. When disabled the A link tag is not rendered. I cannot get the styles to look consistent for all four states and accross browsers. It is a nightmare! Display the HTML and see for yourself... I am using IE6/Firefox1.0/Netscape7.2. In IE there is an extra row of pixels between the tab and the tab horizontal line. In FireFox/Netscape the tab extends below the tab horizontal line and the selected tab and hover color extend into the tab spacing area.
Will someone take a look and let me know what I can do to fix this nightmare... Thanks in Advance, Paul