0

Is there a way to rotate letter A on letter B hovered using HTML, CSS and JS? ~ seems to doesn't work, because "B" is next to "A"

HTML

<h2 class='h2' id='A' style="display:inline-block;">A</h2>
<h2 class='h2' id='B' style="display:inline-block;">B</h2>

CSS

.h2
{
    font-size: 50px;
    font-family: times new roman;
    font-style: regular;
    color: black;
}
#A:active
{
    transform: scale(1.5);
}
#B:hover ~ #A
{
    transform: rotate(90deg);
}

Code example: https://jsfiddle.net/f4p6rzgs/1

hipstorsmith
  • 41
  • 5
  • The answers here might be usefull: [Is there a "previous sibling" selector?](https://stackoverflow.com/questions/1817792/is-there-a-previous-sibling-selector) – aerial Dec 26 '21 at 11:31

0 Answers0