Как сделать чтоб при :hover к одному элементу менялся другой?

Question

[Дюша Метёлкин]

Здравствуйте, нужно чтобы при :hover к первой p менялся font-size: у второй при этом нельзя менять html код и использовать js, как это реализовать ? и почему мой код не срабатывает ? https://codepen.io/Dyusha/pen/GRpgBgr

Answer 1

[xdevelx]

https://codepen.io/xdevelx/pen/RwWNBPo

Потому что используете Селектор потомков, а нужно https://developer.mozilla.org/ru/docs/Web/CSS/Adja... или https://developer.mozilla.org/ru/docs/Web/CSS/Gene...

Comments

[Дюша Метёлкин]

спасибо

[Евгений]

Дюша Метёлкин, используй + если соседний и ~ нужно достучаться до родственного

[Дюша Метёлкин]

Евгений, спасибо, напишите в ответе чтобы я отметил вас

[Евгений]

Дюша Метёлкин, думаю не стоит) просто это нюанс, о котором нужно помнить)

Answer 2

[Тигран Абрамян]

p:nth-child(1):hover ~ p:nth-child(2){
  font-size: 40px;
}

Comments

[Дюша Метёлкин]

спасибо