单击另一个元素时，元素上的CSS转换

Question

我正在尝试使用纯CSS点击div元素时转换a元素。到目前为止，这是我的代码：

HTML：

<div id="red"></div>

<a href="#" id="click">Click me</a>

CSS：

div#red {width: 100px;
        height: 100px;
        background-color: red;
        transition: 2s ease;}

a#click:active~ #red {width: 300px;}

我有一种感觉，我想做的事情是不可能的。转换是否必须在单击的同一元素上进行？