Problems with link inheritance in IE6

[karinne]

I've tried moving stuff in my css around but no luck. I'm using IE6 (XP) and I get these 2 borders on some links... for example http://www.karinnelegault.com/quebec4x4/mirc/ see the grey line above the mirc image... and the black one below? Shouldn't be there!?

Same with http://www.karinnelegault.com/quebec4x4/mirc/ only the first name has those 2 lines... not the others which are links as well?!!?

Here's my CSS

body {
background-color: #999;
font-family: 'Trebuchet MS', 'lucida sans unicode', helvetica, verdana, arial, sans-serif;
font-size: 9pt;
color: #fff;
margin: 0;
}
td {
font-family: 'Trebuchet MS', 'lucida sans unicode', helvetica, verdana, arial, sans-serif;
font-size: 9pt;
}
th {
font-family: 'Trebuchet MS', 'lucida sans unicode', helvetica, verdana, arial, sans-serif;
font-size: 9pt;
font-weight: 700;
}
p {
padding-left: 10px;
margin: 0 0 11px;
clear: both;
}
h1 {
font-size: 13pt;
color: #fff;
font-weight: 800;
margin: 0 5px 10px;
border-bottom: 1px dotted #99c;
}
h2 {
font-size: 11pt;
color: #99f;
font-weight: 800;
margin: 0 8px 10px;
}
h3 {
font-size: 10pt;
color: #000;
font-weight: 800;
margin: 0 8px 5px;
}
h4 {
font-size: 9pt;
color: #000;
font-weight: 800;
margin: 0 8px 0;
}

.formfield {
border: 1px solid #69c;
color: #000;
font-size: 9pt;
background-color: #dedede;
}
.formbutton {
border: 1px solid #69c;
color: #000;
font-weight: 700;
font-size: 8pt;
background-color: #ccc;
padding-left: 3px;
padding-right: 3px;
}

a, a:link, a:active, a:visited {
text-decoration : none;
color: #ccc;
}
a:hover {
text-decoration : none;
color: #99c;
}

a.nouvelles:link, a.nouvelles:visited, a.nouvelles:active {
font-weight: 700;
font-size: 8pt;
color: #ff9;
text-decoration: none;
border: 0;
font-variant: normal;
}
a.nouvelles:hover {
font-weight: 700;
font-size: 8pt;
color: #fff;
text-decoration: none;
border: 0;
}

div#menu a:link, a:active, a:visited {
background-color: transparent;
padding-left: 10px;
padding-top: 2px;
padding-bottom: 2px;
border-top: 1px solid #000;
border-bottom: 1px solid #ccc;
color: #fff;
text-decoration: none;
font-weight: 500;
font-variant: small-caps;
font-size: 8pt;
letter-spacing: 1px;
display: block;
}
div#menu a:hover {
background-color: #8585a8;
text-decoration: none;
font-weight: 700;
display: block;
}

It just started acting weird when I changed my menu to use divs (div#menu)

Any help would be greatly appreciated.

[Paul O'B]

Hi,
I can' see what you are talking about.

I can't see any extra lines on your menu links and the lines on your banner image are part of the image.

BTW both the links you gave above are the same. Can you describe exactly which elements you are having problems with and which browser you are using etc ( or post a screenshot as well).

I'm sure you'll get more replies if you can provide some more information (unless it's just me who can't see it of course ).

Paul

[karinne]

Here's an attachement of what I mean.

In the http://karinnelegault.com/quebec4x4/a-propos/ you can see (well I can with IE6) that the first link - Michel Lavallée (which is an e-mail) has the 2 bars like the attachement but the others (Etienne Fortin, Lawrence Martin....) don't... those are OK.


/added
my attachement doesn't seem to be showing up grrrrrr!

/added
$crew it... I got the image I want to show on my server... here -

[BenANFA]

Have to say I can't see the problem either. I also can't see the MIRC logo, not sure why but it might be better to download it from the MIRC website and put it on your own website.

BTW all attachments have to be OK'd by a moderator which is why it wouldn't have appear at first.

[BenANFA]

Ah ha, have recreated it, you have to be focused on the link, then it shows the unwanted lines.

BTW can't see the MIRC logo cos my company block access to the MIRC website I have just discovered.

[Paul O'B]

Hi,

Try changing this definition:

div#menu a:link, a:active, a:visited {

To This:

div#menu a:link, div#menu a:active, div#menu a:visited {

That should sort it.

Paul

[BenANFA]

OK in your styles this line

div#menu a:link, a:active, a:visited {

should be

div#menu a:link, div#menu a:active, div#menu a:visited {

Edit:

Bah at Paul, the one time I thought I'd beaten you to an answer and you got there first

[karinne]

Thank you thank you thank you... that worked! I've been at this for 2 days now! you guys are great!

[Paul O'B]

Bah at Paul, the one time I thought I'd beaten you to an answer and you got there first

Sorry ! I promise not to answer anymore today.

Paul