Anonymous 0

Hi,

How do i change the color of the text in the nav? and why is it aligned to the center by defautt?

10 answers

0
points

I would try using a reset stylesheet Eric Meyer's Reset first.

As far as the link colors:

a:link {color: #fff;} 
a:visited {color: #fff;}
a:hover {color: #000;}
a:active {color: #000;}

or, you can combine the ones which are the same:

a:link, a:visited {color: #fff;}
a:hover, a:active {color: #000;}

Now, obviously, this is super simple, but you get the idea.

Answered over 7 years ago by Ben Shoults
Joel 0
0
points

i added a:link{#636;} a:visited{#36F;} a:hover{#3C3;} a:active{#3FF;} and its not working

Answered over 7 years ago by Joel
0
points

Ben gave you the correct answer but you entered:

a:link{#636;}
a:visited{#36F;}
a:hover{#3C3;}
a:active{#3FF;}

You must add in the color: part before the hexadecimal number for that color.

Answered over 7 years ago by Simon Boak
0
points

You forgot the color attribute:

a:link{color:#636;} 
a:visited{color: #36F;} 
a:hover{color:#3C3;} 
a:active{#3FF;}

Note that things do not work as expected unless you specify link, visited, hover and active in that order. "Las Vegas Hells Angels" is a handy mnemonic for this.

Answered over 7 years ago by Richard Grevers
0
points

Your navigation appears to be in the center of the nav because you have (correctly) put the links within an unordered list. Browsers then apply a left margin to the ul element.

Answered over 7 years ago by Simon Boak
Joel 0
0
points

thanks. why does the display block only work for the right side and not on the left?

Answered over 7 years ago by Joel
0
points

Not quite sure what you mean. What are you applying display: block to?

Answered over 7 years ago by Simon Boak
Joel 0
0
points

i would like to apply it to the navigation links

Answered over 7 years ago by Joel
danwellman 5600
0
points

Applying display:block to the links would do nothing, and the li elements are already block-level. What are you trying to achieve by adding display:block to the links?

Answered over 7 years ago by danwellman
0
points

Are you trying to make the links themselves block elements so that the space around the text is also clickable?

If so, then you would first want to take out the padding of the whole list by adding:

.nav ul {padding-left: 0;}

This moves the links to the left of the div container. Then add li a {display: block;} to make the area to the right of the text also part of the link. To give the links a little space to the left, you might want to change the code to this:

.nav a {
    display: block;
    padding-left: 10px;
}

If you're new to CSS, the .nav a part means target only links within an element with the class of "nav" so that it won't conflict with links in the rest of your page.

Answered over 7 years ago by Simon Boak