Путь селекторов

111

06 сентября 2019, 06:50

У меня есть код. Примерно он выглядит следующем образом:

<html>
<head>
..
</head>
<body>
<div class="left">
<input type="radio" name="radio" id="radio-1">
<label for"radio-1">
<input type="radio" name="radio" id="radio-2">
<label for"radio-2">
</div>
<div class="right">
<img src="" alt="">
<img src="" alt="">
</div>
</body>
</html>

Экран делится на 2 части: левая и правая. Слева радио кнопки, справа картинки в данном случае. Надо при помощи css сделать так, чтобы при нажатии на радио кнопку слева, появлялась картинка справа. Какой путь в css прописывать или это совсем невозможно?

<html>
<head>
..
</head>
<body>
<div>
<div class="one">
<input type="radio" name="radio" id="radio-1">
<label for"radio-1">
<img src="" alt="">
</div>
<div class="two">
<input type="radio" name="radio" id="radio-2">
<label for"radio-2">
<img src="" alt="">
</div>
</div>
</body>
</html>

Просто если код в таком виде будет, то я знаю, что

.one input::checked + img

таким образом можно обратиться к картинке. А если родители разные,то не знаю.