Navigation problems

[lukewilde]

This has been irritating me for hours now, which is stupid. All i am trying to do is have the link get a black background when hovered over and the text to turn white, but i am finding it impossible, the link height is too high but if i change it the text just disapears instead of moving up with it as i would just like the black background to be around 7px around the text and to sit ontop of the diagonal lines.

http://www.lsw-design.com/sgraphics3/

Can anyone please let me know what i am doing wrong or not doing at all?

Thanks.

[TheDoc]

Start by adding display: block; to your anchors. Eg:

.left-menu a {

color: black;

display: block;

}

You should be able to get it from there!

[MurrDogg4]

A couple other things I noticed:

Your h4 appears to have margins so I would set your h4 margins to 0

h4 { margin:0; }

You can then adjust the height and margins of your “left-menu” div.

.left-menu { height: 22px; margin-top: 134px; }

This should almost get you there.

[soap]

Broooooooooooseph you can have a block level element in an anchor if you make the anchor a block, yeah?

[lukewilde]

Thanks a lot for the help, was really annoying me last night.

[lukewilde]

Got something to ask again, how would i get the text in the drop down menus to be white, i’m not sure how to target them without adding a load more id/classes to each link?

[TheDoc]

It looks like you’ve already got it working, but I’ll put this just in case.

To target just the drop down links, you could do something like this:

ul li ul li a { color: whatever; }

[lukewilde]

Yeah i managed to get it after a few more minutes of thinking, thanks for posting though.

I am now wondering why i can’t get the links in the footer to display in a list, i have tried adding display:inline to everything, and doesn’t seem to work so i am guessing it is something else?

[soap]

In a list? What do you mean, on top of each other?

[lukewilde]

Yes i mean on top of each other

[lukewilde]

Does someone know how to solve this?

[soap]

Well they’re being displayed inline so they will be IN LINE :P

Display them as block and remove float:left.

[lukewilde]

Thanks for that, not sure why i was putting inline, got confused with the normal nav i guess.

[Author]

Posts