Forums

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.

wolfcry911

Its also invalid. In html4 you can't have a block level element in an anchor.

soap

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

wolfcry911

no, not in html4 or xhtml - but it's fine in html5

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.

treehouse : what would you like to learn today?

Forums

Navigation problems