Trying to resolve a few cross-browser issues - cat-tabs Opera etc

[bobguindon]

I'm trying to clean up a few remaining cross-browser issues. The browsers that I'm using are IE7, Firefox 2, and Opera 9. I am running version 1.3.7 and my site is www.superphones.com. Also, I am using the nightfall template.

First, the categories shown in the header are fine with IE7 and FF, but don't wrap in Opera.

The layout of the right sideboxes looks fine in IE7, but in FF and Opera the sideboxes are nudging the right edge, leaving a ragged right edge.

The login page looks fine in IE and Opera, but in FF some of the text input boxes appear above the titles - for example, the email address text input box appears above the title 'Email Address:'.

Since I added a background image to the main page, the right side of the left sideboxes are clipped off in FF and Opera, but look fine in IE7. I haven't yet tried making the background image smaller, but the left side of the image does not appear to be 'touching' the left edge of the sideboxes.

Finally, even after 'resetting' IE7, I am still having trouble with IE7 reporting 'both secure and insecure items' when returning to the main page from the log in page. Neither FF or Opera complains about this. My links appear to be relative, so I don't know where this is coming from.

Any pointers towards cleaning up these issues would be greatly appreciated. Sorry for the long post, but these issues all seem be related by being cross-browser.

Thanks,
Bob

[bobguindon]

OK, I fixed the last item in my list - the background image had an absolute link - I changed it to relative, although it took me a few minutes to realize that the relative link need to be in single quotes:

Old: url(http://www.superphones.com/images/cartbackground.jpg)
New: url('/images/cartbackground.jpg')

Now, to attack the other issues...

Bob

[Kim]

Post your CSS for the cattabs -

[bobguindon]

Here is the portion of my .css that deals with CatTabs:

#navMainWrapper, #navSuppWrapper, #navCatTabsWrapper {
margin: 0em;
background-color: #ffffff;
font-weight: bold;
color: #000000;
height: 1%;
width: 100%;
}
#navMain ul, #navSupp ul, #navCatTabs ul {
margin: 0;
padding: 0.5em 0em;
list-style-type: none;
text-align: center;
line-height: 1.5em;
}
#navMain ul li, #navSupp ul li, #navCatTabs ul li {
display: inline;
white-space: nowrap;
}
#navMain ul li a, #navSupp ul li a, #navCatTabs ul li a {
text-decoration: none;
padding: 0em 0.5em;
margin: 0;
color: #3300FF;
}

After some additional forum research last night, I found this thread: http://www.zen-cart.com/forum/showthread.php?t=33433 that describes the problem and offers a possible solution. My understanding, though, from reading other threads on related issues is that this won't work well with categories that have more than one word in the names. Apparently, this is a known issue with Opera.

Thanks,
Bob