css navigation tabs issue
Hi,
OK on this site:
http://everythingever.com/lifestyle/
I have two issues I'm hoping someone can help with.
in IE8 I'm noticing the Home link (first one) has a strange line that no other tabs have and no other browsers seem to show. Any idea what that is and how to remedy?
Then the second issue - I'm trying to do a "sliding doors" technique to allow the tabs to resize based on the text, but my SPAN style messes up the button. The way it is currently, when I mouse over, the left corner is changing correctly, but the rest of it is not. When I style my SPAN (which I thought would change the rest of the button image on mouseover) it instead shows the mouseover color for the right half of the button.
So I've commented that style out in the CSS sheet.
Can anyone help me wrap this up to get mouseover affect as expected and clean in all current browsers?
Thanks
OK on this site:
http://everythingever.com/lifestyle/
I have two issues I'm hoping someone can help with.
in IE8 I'm noticing the Home link (first one) has a strange line that no other tabs have and no other browsers seem to show. Any idea what that is and how to remedy?
Then the second issue - I'm trying to do a "sliding doors" technique to allow the tabs to resize based on the text, but my SPAN style messes up the button. The way it is currently, when I mouse over, the left corner is changing correctly, but the rest of it is not. When I style my SPAN (which I thought would change the rest of the button image on mouseover) it instead shows the mouseover color for the right half of the button.
So I've commented that style out in the CSS sheet.
Can anyone help me wrap this up to get mouseover affect as expected and clean in all current browsers?
Thanks
imantas
Could you please provide a screenshot? My IE8 doesn't show any srange lines.
ASKER
Ok, here is a screen shot
Thanks
Bill
Thanks
Bill
I just cannot recreate the issue. Only thing that caused similar effect (or even the same) was adding 1px padding-left to the second LI element in the list ("About Us" link). I'm not sure why could this happen, but maybe if you set it's padding directly:
<li style="padding: 0px"><a .. ><span>
...ASKER
Thanks - I'll try that - really the larger issue is what it's doing on mouse over - any ideas there?
Bill
Bill
If it's padding problem I've described, then it should persist even on mouseover, as this event only changes the "left" background (of the anchor element), not the right, which has the 1px line visible on the left.
ASKER
no sorry - in my original question I have two problems - one is the line and the other is mouseover issues with the wrong background button image showing.
ASKER CERTIFIED SOLUTION
membership
Create a free account to see this answer
Signing up is free and takes 30 seconds. No credit card required.
ASKER
That was it - thanks