Show :after when hovering over the parent element via CSS

[Maddisonxao]

Is it possible to \[code\]display:block;\[/code\] the \[code\]:after\[/code\] pseudo-element when I hover over the parent element itself?\[code\]#myDiv{ position:relative; width:50px; height:50px; border-style:solid; background-color:red;}#myDiv:after{ position:absolute; content:""; display:none; width:50px; height:50px; border-style:solid; background-color:blue;}\[/code\]I have tired:\[code\]#myDiv:hover #myDiv:after{ display:block;}#myDiv:hover + #myDiv:after{ display:block;}#myDiv:hover > #myDiv:after{ display:block;}\[/code\]Yet no luck, here's a fiddle.