9 replies [Last post]
1ndiana
Offline
newbie
Last seen: 13 years 5 weeks ago
Joined: 2007-08-29
Posts: 6
Points: 0

I am trying to get my text links to have an underline when I hover the mouse over them. I had it working, but cannot for the life of me figure out why it has stopped. I apologise as I am a complete amateur and expect the answer is very simple.

#navbar {
position: absolute; left: 200px; top: 200px;
width: 800px; height: 17px;
background-color="#006600";
font-family: Arial, Helvetica, sans-serif;
font-size: 13px
}
a:link {color: white; text-decoration: none;}
a:hover {color: white; text-decoration: underline}
a:active {color: white; font-weight: bold}
a:visited {color: white; text-decoration: none}

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 41 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

A number of points link

A number of points link pseudo states must follow a precise order;

:link
:visited
:focus
:hover
:active

Try removing the :link and all the repeated color declarations you only need state them once for the generic anchor element that will aplly also to the visited text-decoration.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

Katie
Katie's picture
Offline
Enthusiast
Seattle, WA
Last seen: 4 years 50 weeks ago
Seattle, WA
Timezone: GMT-8
Joined: 2006-08-06
Posts: 357
Points: 2

The order of link

The order of link specifications has tripped me up once or twice. I try to use the "Love, Ha!" mnemonic to remember it.

Blog: Pew Pew Laser Blog
Online File Storage: DropBox
Daily Deals on Local Activities: Groupon

1ndiana
Offline
newbie
Last seen: 13 years 5 weeks ago
Joined: 2007-08-29
Posts: 6
Points: 0

Thanks

I will try these suggestions when I get home this evening - Cheers!

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 31 weeks 3 days ago
Joined: 2004-06-30
Posts: 9668
Points: 801

DTD

Don't forget the Doctype!

Verschwindende wrote:
  • CSS doesn't make pies

1ndiana
Offline
newbie
Last seen: 13 years 5 weeks ago
Joined: 2007-08-29
Posts: 6
Points: 0

Vertical Bar/Line Character

Don't worry I hadn't forgot about DOCTYPE, just playing with code at moment whilst I'm learning. Thanks guys got it working. Now next question - I've added vertical lines or bars (whatever you prefer to call them) to break up the text links. But why are they not white?

#navbar {
position: absolute; left: 200px; top: 200px;
width: 800px; height: 22px;
background-color="#009900";
font-family: Arial, Helvetica, sans-serif;
font-size: 18px
}
a:visited {color: white; text-decoration: none}
a:hover {text-decoration: underline}
a:active {font-weight: bold; text-decoration: none}

Katie
Katie's picture
Offline
Enthusiast
Seattle, WA
Last seen: 4 years 50 weeks ago
Seattle, WA
Timezone: GMT-8
Joined: 2006-08-06
Posts: 357
Points: 2

Because there's no style

Because there's no style declaration for the bars to be white. Those vertical bars are just regular body text. Only the visited links are supposed to be white (according to the code).

Also, you might want to fix your background-color declaration on #navbar. As it is, it's invalid and doesn't work in FF. It should be like this:

background-color: #009900;

Lastly, you really must add a doctype, even during the initial debug stages. The doctype is essential for telling the browser which of possible methods for rending your page is the correct way. As someone says - "There is no correct way to render a page without a doctype.". (But I've forgotten who says that. Ed House? Seedhouse? Edseed? My apologies to that person.)

Blog: Pew Pew Laser Blog
Online File Storage: DropBox
Daily Deals on Local Activities: Groupon

Ed Seedhouse
Ed Seedhouse's picture
Offline
Guru
Victoria British Columbia
Last seen: 44 weeks 1 day ago
Victoria British Columbia
Timezone: GMT-8
Joined: 2005-12-14
Posts: 3570
Points: 675

Katie wrote:Lastly, you

Katie wrote:
Lastly, you really must add a doctype, even during the initial debug stages. The doctype is essential for telling the browser which of possible methods for rending your page is the correct way. As someone says - "There is no correct way to render a page without a doctype.". (But I've forgotten who says that. Ed House? Seedhouse? Edseed? My apologies to that person.)

Well I've repeatedly said "there is no standard way to render invalid html" in various forms but I don't remember saying it exactly that way. However it's pretty well true so let's pretend I said it. :thumbsup:

Ed Seedhouse

Posting Guidelines

Watch out! I am carrying irony, sarcasm and satire, and know how to use them.

1ndiana
Offline
newbie
Last seen: 13 years 5 weeks ago
Joined: 2007-08-29
Posts: 6
Points: 0

And then there was white

Thanks Katie - got it working. And won't forget to include doc type in future.

Katie
Katie's picture
Offline
Enthusiast
Seattle, WA
Last seen: 4 years 50 weeks ago
Seattle, WA
Timezone: GMT-8
Joined: 2006-08-06
Posts: 357
Points: 2

And we'll pretend I got your

And we'll pretend I got your name right, too. Wink

Blog: Pew Pew Laser Blog
Online File Storage: DropBox
Daily Deals on Local Activities: Groupon