1

Quick scenario: I have a menu that has black anchors by default and when I hover over a link it changes to white using :hover, standard enough stuff. How though would I then change all the other links to darkgray whilst the link that is being hovered over stay white?

I've had a look through http://www.w3schools.com/css/css_pseudo_classes.asp as my guess is it's one of these, however the descriptions don't seem to match what I'm after.

A1raa
  • 605
  • 1
  • 7
  • 22
  • That's probably why I couldn't find any material to form a CSS solution as I thought it might have been possible. – A1raa May 23 '15 at 20:24
  • Yeh that's the sort of thing I was after. Appreciate the response even though the question was closed. – A1raa May 23 '15 at 20:58
  • If you feel it can be answered with CSS go ahead..but your fiddle does not cover the original scenario. The list items must have a default color. Perhaps this - http://jsfiddle.net/1atzsp3w/3/ – Paulie_D May 24 '15 at 17:57

1 Answers1

0

I have created a simple fiddle with CSS only, using ul:hover and ul:hover a:hover.

a{
background: grey;
padding: 3px;
}
li{
float: left; list-style: none; margin-right: 5px;
}
ul:hover a{
color: #f00;
}
ul:hover a:hover{
color: white;
}
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
</ul>

http://jsfiddle.net/afelixj/mro07h6p/2/

Felix A J
  • 6,300
  • 2
  • 27
  • 46