Little CSS Question

[Zenax]

Well now I ask you intelligent guys a question on CSS.

Take a look at this:

http://projectmicah.com/v2/index2.php

Hover over the top link and then look at the second link, and you will understand what happens.

The second link seems to move down about 10px.

CSS Code:

.navcontent a:link, .navcontent a:visited
{
color: #000000;
text-decoration: none;
}

.navcontent a:hover
{
background-color: #0066FF;
border: 1px solid #000000;
color: #FFFFFF;
text-decoration: none;
display: block;
clear: both;
}

The person to reply with an answer that works, gets 50pts.

Regards,
Zenax

[3aKaT]

remove display: block;
--------------------------
<a href="http://#">Home[&nbsp;as many as it need]</a> and use <br /> instead <br>

[Zenax]

Well that fixed that problem, but is there any way to get it stretch the entire width of the nav area with having to put in &nbsp; ??

[3aKaT]

i think in navigation better to use table

[Zenax]

well I design with divs, but I might try a table

Still, any suggestions?

[cetutnx1]

Maybe you can use unordered list, view my attachment

Then you can change the style of the li, and of the anchor....

[t2t2t]

.navcontent a:link, .navcontent a:visited
{
color: #000000;
text-decoration: none;
width: 100%;
}

Try adding red code.

[Zenax]

OK tried both of those suggestions and neither work!

This could really bug me

NEW PAGE: http://projectmicah.com/v2/index2.php

[oab]

it works for me in firefox the old one not 2, and ie6. what browser were you using?

EDIT:
oh yea to stretch it all the way just add width:100%
and if i was you i would make the hover effect also add some left padding.

[Zenax]

Yeah I am fixing the code, but when I change it to width 100% it still does not stretch the whole width.

I think the idea is that I should just do the layout in tables instead, and see what happens when I do that.

Regards,
Zenax