Jak wskazać brata po lewej stronie?

Question

Witam,
Właśnie robię sobie stronkę w html w której obok siebie są trzy divy.
Chciałbym, aby po najechaniu na środkowy, 2 pozostałe zmieniały kolor. Problem jest taki, że selektory + i ~ odwołują się do braci wymienionych po pierwszym obiekcie tzn. tych po prawej stronie. Tak więc, gdy używam +/~ kolor zmienia jedynie prawostronny div, a chciałbym, aby działo tak się po obu stronach. Jak temu zaradzić?

#logo:hover ~ .logo
środkowy div to ten z id, a boczne są w class

Answer 1

Flexbox umie (prawie) wszystko – tutaj wykorzystałem order ;) Logo jest pierwsze w kodzie i dlatego ~ działa, ale jest wyświetlane jako drugie i dlatego wszystko wygląda jak ma wyglądać: http://codepen.io/Comandeer/pen/gaqPrq

Comments

Comandeer, mógłbyś podesłać co to ten ~, jak wpisałem w google ~ css to mi wyświetła się na pierwszym miejscu stronka:

CSS - Wikipedia

;v.

 

---

Selektor rodzeństwa: http://www.kurshtml.edu.pl/css/ogolny_selektor_braci,elementy.html

---

Michał, już dawno się tak nie śmiałem! Haha, "~  to jest tylda", a to dobre!

Dzięki Comandeer. :)

---

Powiedzmy, że właśnie zaznajomiłem się na szybko z flexem oraz orderem i bardzo ładnie mi działa :3 Nie do końca rozumiem po co divy dostały flex:1
W każdym razie wielkie dzięki ;)

---

Dostały, żeby dopasowywać się do wielkości rodzica.