Działanie na element nie znajdujący się w nim.

Question

Mam Ci ja taki kod:
 

<div class="single-hexagon-button hexagon-big">
	<svg version="1.1" id="hexagon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	viewBox="0 0 247.236 266.797" enable-background="new 0 0 247.236 266.797"
	xml:space="preserve">
       <path fill="none" stroke="#000000" stroke-width="6" stroke-miterlimit="10" d="M241.354,181.811
	c0.022,11-7.745,24.516-17.261,30.034l-82.698,47.964c-9.516,5.519-25.104,5.55-34.641,0.068l-82.887-47.636
	c-9.537-5.481-17.358-18.966-17.38-29.966l-0.189-95.6c-0.022-11,7.746-24.516,17.261-30.034l82.698-47.964
	c9.516-5.519,25.104-5.55,34.641-0.068l82.887,47.636c9.537,5.481,17.357,18.966,17.38,29.966L241.354,181.811z"/>
	</svg>
	<i class="fa fa-pencil" aria-hidden="true"></i>
    <p style="left:45px;">Blog</p>
</div>

(tak wiem, style w html, ale nie wiem czemu nie mogłem się dostać do niego przez CSS - mniejsza :( ) 
No i ogólnie żeby wypełnić path przez hover filoetowym kolorem - daję svg path:hover{fill:#9f449b; stroke:#9f449b;} . I działa - wypełnia mi to filoetem sześciokąt. Tyle, że chciałbym, żeby po najechaniu na "p" oraz "i" też działało. Próbowałem selektorem "+", ale nie pasuje mu coś... Znając życie to banalnie proste i wystarczy jeden selektor ale jaki?

Answer 1

Łap przykład ze stacka : http://jsfiddle.net/j2hnJ/

Comments

No właśnie już przedtem dałem .single-hexagon-button i:hover + svg path  i nic :( Najeżdżam na to i path jak było przeźroczyste tak jest

---

Dzięki! Odpowiedziałeś na moją odwieczną zagadkę! 

 

---

Ale ja nie odpowiedziałem na swoją...

---

A może nie selektor + tylko ~ ?

---

znaczy mi właśnie chodziło o ~ a nie +

---

Takie moje testy: http://codepen.io/Nicolaus/pen/qqoPKM

---

Nope :(

---

To niestety nie wiem ;(

Answer 2

.single-hexagon-button svg path:hover, .hexagon-button-arrow svg path:hover, .single-hexagon-button i:hover ~ svg path{
	fill: #9f449b;
	stroke: #9f449b;
	cursor: pointer;
}

Też nie działa...

Comments

Chodzi o coś takiego :)?

https://jsbin.com/yapehibule/edit?html,css,js,console,output

---

O matko, aż JS trzeba do tego zaprzęgnąć? Szczerze powiedziawszy nie zacząłem jeszcze JS'a więc myślałem, ze da się to jakoś ominąć :(