CSS, наведите один элемент, повлияйте на другой

Question

Когда я нахожу «li a», я могу повлиять на другой элемент простого CSS?

Потому что я пытаюсь сделать коробку слайдом, как элемент фона, при падении моей ссылки. Точно как этот объект навигация, только вместо того, чтобы при активации, он работает с парением

http://www.zindhai.com

это мой код

nav ul li a:hover{ 
    color: #C3E1FF; 
    font-weight: 700; 
} 

nav ul li span:hover{ 
    -webkit-transform:translate(0px, 0px); 
    -webkit-transition:all 0.5s ease-out; 
    transition:all 0.5s ease-out; 
} 

nav ul li span{ 
    height:43px; 
    width:300px; 
    position: absolute; 
    background-color:#47525D; 
    -webkit-transform:translate(300px, 0px); 
    -webkit-transition:all 0.5s ease-out; 
    transition:all 0.5s ease-out; 
    background-position:initial initial; 
    background-repeat:initial initial; 
} 

спасибо заранее!

Вот как это выглядит сейчас;

http://jsfiddle.net/mbyc3tf9/

Answer 1

Если вам нужно переместить промежуток, когда вы поместите курсор на а, добавьте этот

nav ul li a:hover > span {} 

Answer 2

Да, это довольно легко сделать. Предполагая, что ваш HTML называется, например, .myElement. Все, что вам нужно сделать, это ...

nav ul li a:hover .myElement { ... }

Затем введите CSS внутри { }.