weird jQuery tabs behavior on IE 7
Perhaps this is a css issue in IE 7 but I tried many different
workarounds but I cannot resolve it.
Here's the problem: this page looks fine in FF and IE 6 but not IE 7
http://regretless.com/work/AvivaDesign/layout.php?section=EContracting&page=ECTabs
in IE 7 the first tab "distributions" show up in the upper left corner
instead of its expected place. However it goes back to its correct
location as soon as you click on another tab. But on page reload if
you had distributions selected, the problem is back. I narrowed the
problem down to the height & padding in my left menu, if I strip them,
the problem will be fixed as demonstrated here:
http://regretless.com/work/AvivaDesign/layout.php?section=EContracting&page=ECTabs&fixTabsInIE7=true
However, I absolutely need to put the extra space in. I tried using
height, margin, padding or border, even a table. But as soon as I add
anything, the issue reoccurs in IE 7. I'm out of ideas here. Does
anyone know the real issue?
Thanks!!